alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

docs: prettier all markdown files

Browse Source
This commit is contained in:
chenjiahan
2020-04-11 09:17:33 +08:00
committed by neverland
parent 48067f79db
commit 7f84f8a487
140 changed files with 4441 additions and 4723 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/picker/README.zh-CN.md
+82 -76
View File
@@ -29,14 +29,14 @@ import { Toast } from 'vant';
export default {
data() {
return {
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州']
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
};
},
methods: {
onChange(picker, value, index) {
Toast(`当前值：${value}, 当前索引：${index}`);
}
}
},
},
};
```
@@ -68,8 +68,8 @@ import { Toast } from 'vant';
export default {
data() {
return {
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州']
}
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
};
},
methods: {
onConfirm(value, index) {
@@ -77,8 +77,8 @@ export default {
},
onCancel() {
Toast('取消');
}
}
},
},
};
```
@@ -98,16 +98,16 @@ export default {
// 第一列
{
values: ['周一', '周二', '周三', '周四', '周五'],
defaultIndex: 2
defaultIndex: 2,
},
// 第二列
{
values: ['上午', '下午', '晚上'],
defaultIndex: 1
}
]
defaultIndex: 1,
},
],
};
}
},
};
```
@@ -123,27 +123,36 @@ export default {
export default {
data() {
return {
columns: [{
text: '浙江',
children: [{
text: '杭州',
children: [{ text: '西湖区' }, { text: '余杭区' }]
}, {
text: '温州',
children: [{ text: '鹿城区' }, { text: '瓯海区' }]
}]
}, {
text: '福建',
children: [{
text: '福州',
children: [{ text: '鼓楼区' }, { text: '台江区' }]
}, {
text: '厦门',
children: [{ text: '思明区' }, { text: '海沧区' }]
}]
}]
columns: [
{
text: '浙江',
children: [
{
text: '杭州',
children: [{ text: '西湖区' }, { text: '余杭区' }],
},
{
text: '温州',
children: [{ text: '鹿城区' }, { text: '瓯海区' }],
},
],
},
{
text: '福建',
children: [
{
text: '福州',
children: [{ text: '鼓楼区' }, { text: '台江区' }],
},
{
text: '厦门',
children: [{ text: '思明区' }, { text: '海沧区' }],
},
],
},
],
};
}
},
};
```
@@ -164,10 +173,10 @@ export default {
columns: [
{ text: '杭州', disabled: true },
{ text: '宁波' },
{ text: '温州' }
]
{ text: '温州' },
],
};
}
},
};
```
@@ -181,24 +190,21 @@ export default {
```js
const citys = {
'浙江': ['杭州', '宁波', '温州', '嘉兴', '湖州'],
'福建': ['福州', '厦门', '莆田', '三明', '泉州']
浙江: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
福建: ['福州', '厦门', '莆田', '三明', '泉州'],
};
export default {
data() {
return {
columns: [
{ values: Object.keys(citys) },
{ values: citys['浙江'] }
]
columns: [{ values: Object.keys(citys) }, { values: citys['浙江'] }],
};
},
methods: {
onChange(picker, values) {
picker.setColumnValues(1, citys[values[0]]);
}
}
},
},
};
```
@@ -215,7 +221,7 @@ export default {
data() {
return {
columns: [],
loading: true
loading: true,
};
},
created() {
@@ -223,7 +229,7 @@ export default {
this.loading = false;
this.columns = ['选项'];
}, 1000);
}
},
};
```
@@ -256,15 +262,15 @@ export default {
return {
value: '',
showPicker: false,
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州']
}
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
};
},
methods: {
onConfirm(value) {
this.value = value;
this.showPicker = false;
}
}
},
},
};
```
@@ -273,57 +279,57 @@ export default {
### Props
| 参数 | 说明 | 类型 | 默认值 |
|------|------|------|------|
| columns | 对象数组，配置每一列显示的数据 | *Column[]* | `[]` |
| title | 顶部栏标题 | *string* | - |
| confirm-button-text | 确认按钮文字 | *string* | `确认` |
| cancel-button-text | 取消按钮文字 | *string* | `取消` |
| value-key | 选项对象中，选项文字对应的键名 | *string* | `text` |
| toolbar-position | 顶部栏位置，可选值为`bottom` | *string* | `top` |
| loading | 是否显示加载状态 | *boolean* | `false` |
| show-toolbar | 是否显示顶部栏 | *boolean* | `false` |
| allow-html `v2.1.8` | 是否允许选项内容中渲染 HTML | *boolean* | `true` |
| default-index | 单列选择时，默认选中项的索引 | *number \| string* | `0` |
| item-height | 选项高度 | *number \| string* | `44` |
| visible-item-count | 可见的选项个数 | *number \| string* | `5` |
| swipe-duration `v2.2.10` | 快速滑动时惯性滚动的时长，单位`ms` | *number \| string* | `1000` |
| --- | --- | --- | --- |
| columns | 对象数组，配置每一列显示的数据 | _Column[]_ | `[]` |
| title | 顶部栏标题 | _string_ | - |
| confirm-button-text | 确认按钮文字 | _string_ | `确认` |
| cancel-button-text | 取消按钮文字 | _string_ | `取消` |
| value-key | 选项对象中，选项文字对应的键名 | _string_ | `text` |
| toolbar-position | 顶部栏位置，可选值为`bottom` | _string_ | `top` |
| loading | 是否显示加载状态 | _boolean_ | `false` |
| show-toolbar | 是否显示顶部栏 | _boolean_ | `false` |
| allow-html `v2.1.8` | 是否允许选项内容中渲染 HTML | _boolean_ | `true` |
| default-index | 单列选择时，默认选中项的索引 | _number \| string_ | `0` |
| item-height | 选项高度 | _number \| string_ | `44` |
| visible-item-count | 可见的选项个数 | _number \| string_ | `5` |
| swipe-duration `v2.2.10` | 快速滑动时惯性滚动的时长，单位`ms` | _number \| string_ | `1000` |
### Events
当选择器有多列时，事件回调参数会返回数组
| 事件名 | 说明 | 回调参数 |
|------|------|------|
| --- | --- | --- |
| confirm | 点击完成按钮时触发 | 单列：选中值，选中值对应的索引<br>多列：所有列选中值，所有列选中值对应的索引 |
| cancel | 点击取消按钮时触发 | 单列：选中值，选中值对应的索引<br>多列：所有列选中值，所有列选中值对应的索引 |
| change | 选项改变时触发 | 单列：Picker 实例，选中值，选中值对应的索引<br>多列：Picker 实例，所有列选中值，当前列对应的索引 |
### Slots
| 名称 | 说明 |
|------|------|
| default | 自定义顶部栏内容 |
| title | 自定义标题内容 |
| columns-top | 自定义选项上方内容 |
| 名称 | 说明 |
| -------------- | ------------------ |
| default | 自定义顶部栏内容 |
| title | 自定义标题内容 |
| columns-top | 自定义选项上方内容 |
| columns-bottom | 自定义选项下方内容 |
### Column 数据结构
当传入多列数据时，`columns`为一个对象数组，数组中的每一个对象配置每一列，每一列有以下`key`
| 键名 | 说明 | 类型 |
|------|------|------|
| values | 列中对应的备选值 | *string[]*
| defaultIndex | 初始选中项的索引，默认为 0 | *number* |
| className | 为对应列添加额外的类名 | *any* |
| children `v2.4.5` | 级联选项 | *Column* |
| 键名 | 说明 | 类型 |
| ----------------- | -------------------------- | ---------- |
| values | 列中对应的备选值 | _string[]_ |
| defaultIndex | 初始选中项的索引，默认为 0 | _number_ |
| className | 为对应列添加额外的类名 | _any_ |
| children `v2.4.5` | 级联选项 | _Column_ |
### 方法
通过 ref 可以获取到 Picker 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)
| 方法名 | 说明 | 参数 | 返回值 |
|------|------|------|------|
| --- | --- | --- | --- |
| getValues | 获取所有列选中的值 | - | values |
| setValues | 设置所有列选中的值 | values | - |
| getIndexes | 获取所有列选中值对应的索引 | - | indexes |