mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-05-30 18:29:16 +08:00
[Doc] update mobile nav
This commit is contained in:
parent
2f3869f028
commit
3fb3ccad34
@ -3,50 +3,60 @@ export default {
|
|||||||
title: '基础组件',
|
title: '基础组件',
|
||||||
content: [
|
content: [
|
||||||
{
|
{
|
||||||
name: 'Badge 徽章',
|
|
||||||
path: '/pages/badge/index'
|
|
||||||
}, {
|
|
||||||
name: 'Button 按钮',
|
|
||||||
path: '/pages/button/index'
|
|
||||||
}, {
|
|
||||||
name: 'Card 卡片',
|
|
||||||
path: '/pages/card/index'
|
|
||||||
}, {
|
|
||||||
name: 'Cell 单元格',
|
|
||||||
path: '/pages/cell/index'
|
|
||||||
}, {
|
|
||||||
name: 'Helper 基础样式',
|
|
||||||
path: '/pages/helper/index'
|
|
||||||
}, {
|
|
||||||
name: 'Icon 图标',
|
|
||||||
path: '/pages/icon/index'
|
|
||||||
}, {
|
|
||||||
name: 'Layout 布局',
|
name: 'Layout 布局',
|
||||||
path: '/pages/layout/index'
|
path: '/pages/layout/index'
|
||||||
}, {
|
},
|
||||||
name: 'loading 加载',
|
{
|
||||||
|
name: 'Base 基础样式',
|
||||||
|
path: '/pages/helper/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Badge 徽章',
|
||||||
|
path: '/pages/badge/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Button 按钮',
|
||||||
|
path: '/pages/button/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Cell 单元格',
|
||||||
|
path: '/pages/cell/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Icon 图标',
|
||||||
|
path: '/pages/icon/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Loading 加载',
|
||||||
path: '/pages/loading/index'
|
path: '/pages/loading/index'
|
||||||
}, {
|
},
|
||||||
name: 'NoticeBar 通告栏',
|
{
|
||||||
path: '/pages/notice-bar/index'
|
|
||||||
}, {
|
|
||||||
name: 'Panel 面板',
|
|
||||||
path: '/pages/panel/index'
|
|
||||||
}, {
|
|
||||||
name: 'Popup 弹出层',
|
|
||||||
path: '/pages/popup/index'
|
|
||||||
}, {
|
|
||||||
name: 'Steps 步骤条',
|
|
||||||
path: '/pages/steps/index'
|
|
||||||
}, {
|
|
||||||
name: 'Tab 标签',
|
|
||||||
path: '/pages/tab/index'
|
|
||||||
}, {
|
|
||||||
name: 'Tag 标记',
|
|
||||||
path: '/pages/tag/index'
|
|
||||||
}, {
|
|
||||||
name: 'Loadmore 加载更多',
|
name: 'Loadmore 加载更多',
|
||||||
path: '/pages/loadmore/index'
|
path: '/pages/loadmore/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'NoticeBar 通告栏',
|
||||||
|
path: '/pages/notice-bar/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Panel 面板',
|
||||||
|
path: '/pages/panel/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Popup 弹出层',
|
||||||
|
path: '/pages/popup/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Steps 步骤条',
|
||||||
|
path: '/pages/steps/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Tab 标签',
|
||||||
|
path: '/pages/tab/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Tag 标记',
|
||||||
|
path: '/pages/tag/index'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
@ -56,22 +66,24 @@ export default {
|
|||||||
{
|
{
|
||||||
name: 'Checkbox 复选框',
|
name: 'Checkbox 复选框',
|
||||||
path: '/pages/checkbox/index'
|
path: '/pages/checkbox/index'
|
||||||
}, {
|
},
|
||||||
name: 'Datetime 时间选择器',
|
{
|
||||||
path: '/pages/datetime/index'
|
|
||||||
}, {
|
|
||||||
name: 'Field 输入框',
|
name: 'Field 输入框',
|
||||||
path: '/pages/field/index'
|
path: '/pages/field/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'Radio 单选框',
|
name: 'Radio 单选框',
|
||||||
path: '/pages/radio/index'
|
path: '/pages/radio/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'Search 搜索',
|
name: 'Search 搜索',
|
||||||
path: '/pages/search/index'
|
path: '/pages/search/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'Stepper 步进器',
|
name: 'Stepper 步进器',
|
||||||
path: '/pages/stepper/index'
|
path: '/pages/stepper/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'Switch 开关',
|
name: 'Switch 开关',
|
||||||
path: '/pages/switch/index'
|
path: '/pages/switch/index'
|
||||||
}
|
}
|
||||||
@ -83,16 +95,32 @@ export default {
|
|||||||
{
|
{
|
||||||
name: 'Actionsheet 上拉菜单',
|
name: 'Actionsheet 上拉菜单',
|
||||||
path: '/pages/actionsheet/index'
|
path: '/pages/actionsheet/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'Dialog 弹出框',
|
name: 'Dialog 弹出框',
|
||||||
path: '/pages/dialog/index'
|
path: '/pages/dialog/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
|
name: 'DatetimePicker 时间选择器',
|
||||||
|
path: '/pages/datetime/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
name: 'Toast 轻提示',
|
name: 'Toast 轻提示',
|
||||||
path: '/pages/toast/index'
|
path: '/pages/toast/index'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
name: 'TopTips 顶部提示',
|
name: 'TopTips 顶部提示',
|
||||||
path: '/pages/toptips/index'
|
path: '/pages/toptips/index'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
},
|
||||||
|
bussiness: {
|
||||||
|
title: '业务组件',
|
||||||
|
content: [
|
||||||
|
{
|
||||||
|
name: 'Card 卡片',
|
||||||
|
path: '/pages/card/index'
|
||||||
|
}
|
||||||
|
]
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -3,12 +3,5 @@ import componentsConfig from './config';
|
|||||||
Page({
|
Page({
|
||||||
data: {
|
data: {
|
||||||
list: componentsConfig
|
list: componentsConfig
|
||||||
},
|
}
|
||||||
|
});
|
||||||
onLoad: function () {
|
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
onShow: function() {
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
@ -5,17 +5,19 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="desc">轻量、可靠的小程序 UI 组件库</view>
|
<view class="desc">轻量、可靠的小程序 UI 组件库</view>
|
||||||
|
|
||||||
<block wx:for="{{ list }}" wx:for-item="group" wx:key="title">
|
<block wx:for="{{ list }}" wx:for-item="group" wx:key="group.title">
|
||||||
<van-panel title="{{ group.title }}">
|
<view class="mobile-nav">
|
||||||
|
<view class="mobile-nav__title">{{ group.title }}</view>
|
||||||
<van-cell-group>
|
<van-cell-group>
|
||||||
<van-cell
|
<van-cell
|
||||||
wx:for="{{ group.content }}"
|
wx:for="{{ group.content }}"
|
||||||
wx:key="name"
|
wx:key="name"
|
||||||
is-link
|
is-link
|
||||||
|
title-width="200px"
|
||||||
url="{{ item.path }}"
|
url="{{ item.path }}"
|
||||||
title="{{ item.name }}"
|
title="{{ item.name }}"
|
||||||
></van-cell>
|
></van-cell>
|
||||||
</van-cell-group>
|
</van-cell-group>
|
||||||
</van-panel>
|
</view>
|
||||||
</block>
|
</block>
|
||||||
</view>
|
</view>
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
.container {
|
.container {
|
||||||
padding-top: 45px;
|
padding: 45px 15px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
@ -29,6 +29,16 @@
|
|||||||
.desc {
|
.desc {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: #455a64;
|
color: #455a64;
|
||||||
margin: 0 0 20px;
|
margin: 0 0 60px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mobile-nav {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-nav__title {
|
||||||
|
font-size: 16px;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 17px 15px;
|
||||||
|
}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<demo-block title="基础用法">
|
<demo-block title="基础用法" padding>
|
||||||
<van-row>
|
<van-row>
|
||||||
<van-col span="8" custom-class="dark">span: 8</van-col>
|
<van-col span="8" custom-class="dark">span: 8</van-col>
|
||||||
<van-col span="8" custom-class="light">span: 8</van-col>
|
<van-col span="8" custom-class="light">span: 8</van-col>
|
||||||
@ -15,7 +15,7 @@
|
|||||||
</van-row>
|
</van-row>
|
||||||
</demo-block>
|
</demo-block>
|
||||||
|
|
||||||
<demo-block title="在列元素之间增加间距">
|
<demo-block title="在列元素之间增加间距" padding>
|
||||||
<van-row gutter="20">
|
<van-row gutter="20">
|
||||||
<van-col span="8" custom-class="dark">span: 8</van-col>
|
<van-col span="8" custom-class="dark">span: 8</van-col>
|
||||||
<van-col span="8" custom-class="light">span: 8</van-col>
|
<van-col span="8" custom-class="light">span: 8</van-col>
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
<van-icon wx:if="{{ icon }}" custom-class="van-cell__left-icon left-icon-class" name="{{ icon }}" />
|
<van-icon wx:if="{{ icon }}" custom-class="van-cell__left-icon left-icon-class" name="{{ icon }}" />
|
||||||
<slot wx:else name="icon" />
|
<slot wx:else name="icon" />
|
||||||
|
|
||||||
<view wx:if="{{ title }}" class="van-cell__title title-class" style="{{ titleWidth ? 'max-width: ' + titleWidth : '' }}">
|
<view wx:if="{{ title }}" class="van-cell__title title-class" style="{{ titleWidth ? 'max-width: ' + titleWidth + ';min-width: ' + titleWidth : '' }}">
|
||||||
{{ title }}
|
{{ title }}
|
||||||
<view wx:if="{{ label }}" class="van-cell__label label-class">{{ label }}</view>
|
<view wx:if="{{ label }}" class="van-cell__label label-class">{{ label }}</view>
|
||||||
</view>
|
</view>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user