feat(TreeSelect): add dot option (#4433)

This commit is contained in:
neverland
2019-09-11 17:55:28 +08:00
committed by GitHub
parent b1f01c2fb7
commit b279408e10
5 changed files with 96 additions and 17 deletions
+30 -8
View File
@@ -70,14 +70,8 @@ export default {
:main-active-index.sync="activeIndex"
>
<template slot="content">
<van-image
v-if="activeIndex === 0"
src="https://img.yzcdn.cn/vant/apple-1.jpg"
/>
<van-image
v-if="activeIndex === 1"
src="https://img.yzcdn.cn/vant/apple-2.jpg"
/>
<van-image v-if="activeIndex === 0" src="https://img.yzcdn.cn/vant/apple-1.jpg" />
<van-image v-if="activeIndex === 1" src="https://img.yzcdn.cn/vant/apple-2.jpg" />
</template>
</van-tree-select>
```
@@ -93,6 +87,32 @@ export default {
}
```
### 提示信息
设置`dot`属性后,会在图标右上角展示一个小红点。设置`info`属性后,会在图标右上角展示相应的徽标
```html
<van-tree-select
height="55vw"
:items="items"
:main-active-index.sync="activeIndex"
/>
```
```js
export default {
data() {
return {
activeIndex: 0,
items: [
{ text: '浙江', children: [], dot: true },
{ text: '江苏', children: [], info: 5 }
]
}
}
}
```
## API
### Props
@@ -129,6 +149,8 @@ export default {
text: '所有城市',
// 导航名称右上角徽标
info: 3,
// 是否在导航名称右上角显示小红点
dot: true,
// 该导航下所有的可选项
children: [
{