## Functions
<dl>
<dt><a href="#picker">picker(items, options)</a></dt>
<dd><p>picker 多列選擇器。</p>
</dd>
<dt><a href="#datePicker">datePicker(options)</a></dt>
<dd><p>datePicker 時間選擇器,由picker拓展而來,提供年、月、日的選擇。</p>
</dd>
</dl>
<a name="picker"></a>
## picker(items, options)
picker 多列選擇器。
**Kind**: global function
| Param | Type | Default | Description |
| --- | --- | --- | --- |
| items | <code>array</code> | | picker的數據,即用于生成picker的數據,picker的層級可以自己定義,但建議最多三層。數據格式參考example。 |
| options | <code>Object</code> | | 配置項 |
| [options.depth] | <code>number</code> | | picker深度(也就是picker有多少列) 取值為1-3。如果為空,則取items第一項的深度。 |
| [options.id] | <code>string</code> | <code>"default"</code> | 作為picker的唯一標識,作用是以id緩存當時的選擇。(當你想每次傳入的defaultValue都是不一樣時,可以使用不同的id區分) |
| [options.className] | <code>string</code> | | 自定義類名 |
| [options.container] | <code>string</code> | | 指定容器 |
| [options.defaultValue] | <code>array</code> | | 默認選項的value數組 |
| [options.onChange] | <code>function</code> | | 在picker選中的值發生變化的時候回調 |
| [options.onConfirm] | <code>function</code> | | 在點擊"確定"之后的回調。回調返回選中的結果(Array),數組長度依賴于picker的層級。 |
| [options.onClose] | <code>function</code> | | picker關閉后的回調 |
**Example**
```js
// 單列picker
weui.picker([
{
label: '飛機票',
value: 0,
disabled: true // 不可用
},
{
label: '火車票',
value: 1
},
{
label: '汽車票',
value: 3
},
{
label: '公車票',
value: 4,
}
], {
className: 'custom-classname',
container: 'body',
defaultValue: [3],
onChange: function (result) {
console.log(result)
},
onConfirm: function (result) {
console.log(result)
},
id: 'singleLinePicker'
});
```
**Example**
```js
// 多列picker
weui.picker([
{
label: '1',
value: '1'
}, {
label: '2',
value: '2'
}, {
label: '3',
value: '3'
}
], [
{
label: 'A',
value: 'A'
}, {
label: 'B',
value: 'B'
}, {
label: 'C',
value: 'C'
}
], {
defaultValue: ['3', 'A'],
onChange: function (result) {
console.log(result);
},
onConfirm: function (result) {
console.log(result);
},
id: 'multiPickerBtn'
});
```
**Example**
```js
// 級聯picker
weui.picker([
{
label: '飛機票',
value: 0,
children: [
{
label: '經濟艙',
value: 1
},
{
label: '商務艙',
value: 2
}
]
},
{
label: '火車票',
value: 1,
children: [
{
label: '臥鋪',
value: 1,
disabled: true // 不可用
},
{
label: '坐票',
value: 2
},
{
label: '站票',
value: 3
}
]
},
{
label: '汽車票',
value: 3,
children: [
{
label: '快班',
value: 1
},
{
label: '普通',
value: 2
}
]
}
], {
className: 'custom-classname',
container: 'body',
defaultValue: [1, 3],
onChange: function (result) {
console.log(result)
},
onConfirm: function (result) {
console.log(result)
},
id: 'doubleLinePicker'
});
```
<a name="datePicker"></a>
## datePicker(options)
datePicker 時間選擇器,由picker拓展而來,提供年、月、日的選擇。
**Kind**: global function
| Param | Type | Default | Description |
| --- | --- | --- | --- |
| options | | | 配置項 |
| [options.id] | <code>string</code> | <code>"datePicker"</code> | 作為picker的唯一標識 |
| [options.start] | <code>number</code> | <code>string</code> | <code>Date</code> | <code>2000</code> | 起始年份,如果是 `Number` 類型,表示起始年份;如果是 `String` 類型,格式為 'YYYY-MM-DD';如果是 `Date` 類型,就傳一個 Date |
| [options.end] | <code>number</code> | <code>string</code> | <code>Date</code> | <code>2030</code> | 結束年份,同上 |
| [options.cron] | <code>string</code> | <code>"* * *"</code> | cron 表達式,三位,分別是 dayOfMonth[1-31],month[1-12] 和 dayOfWeek[0-6](周日-周六) |
| [options.className] | <code>string</code> | | 自定義類名 |
| [options.defaultValue] | <code>array</code> | | 默認選項的value數組, 如 [1991, 6, 9] |
| [options.onChange] | <code>function</code> | | 在picker選中的值發生變化的時候回調 |
| [options.onConfirm] | <code>function</code> | | 在點擊"確定"之后的回調。回調返回選中的結果(Array),數組長度依賴于picker的層級。 |
**Example**
```js
// 示例1:
weui.datePicker({
start: 1990,
end: 2000,
defaultValue: [1991, 6, 9],
onChange: function(result){
console.log(result);
},
onConfirm: function(result){
console.log(result);
},
id: 'datePicker'
});
// 示例2:
weui.datePicker({
start: new Date(), // 從今天開始
end: 2030,
defaultValue: [2020, 6, 9],
onChange: function(result){
console.log(result);
},
onConfirm: function(result){
console.log(result);
},
id: 'datePicker'
});
// 示例3:
weui.datePicker({
start: new Date(), // 從今天開始
end: 2030,
cron: '* * 0,6', // 每逢周日、周六
onChange: function(result){
console.log(result);
},
onConfirm: function(result){
console.log(result);
},
id: 'datePicker'
});
// 示例4:
weui.datePicker({
start: new Date(), // 從今天開始
end: 2030,
cron: '1-10 * *', // 每月1日-10日
onChange: function(result){
console.log(result);
},
onConfirm: function(result){
console.log(result);
},
id: 'datePicker'
});
```