v0.9+
A series of stream api. It provides function: pick data,pick date,pick time
pick(options, callback[options])
pick data(single column)
options {Object}
:pick options
index {number}
:default selected rowitems {array}
:picker's datatextColor {color}
:text color in the picker itemselectionColor {color}
:the background color of the selected item in the pickerconfirmTitle {string}
:confirm button textcancelTitle {string}
:cancel button textconfirmTitleColor {color}
:confirm button text colorcancelTitleColor {color}
:cancel button text colortitle {string}
:title of dialogtitleColor {color}
:text color of the dialog titletitleBackgroundColor {color}
:background color of the dialog titlecallback {function (ret)}
:the callback function after executing this action.ret {Object}
is callback
's parameter:
result {string}
:result is one of success,cancel,errordata {number}
:the selected index,it exists when result is success.pickDate(options, callback[options])
pick date
options {Object}
:pick date options
value {string}
:Required,date picker selected value by default,date's form is yyyy-MM-ddmax {string}
:optional,date’s max valuemin {string}
:optional,date's min valuecallback {function (ret)}
:the callback function after executing this action.ret {Object} is callback 's parameter:
result {string}
:result is one of success,cancel,errordata {string}
:the selected value,the form of data is yyyy-MM-dd ,it exists when result is success.pickTime(options, callback[options])
pick time
options {Object}
:pick time options
value {string}
:required,the form of value is HH:mmcallback {function (ret)}
:the callback function after executing this action.ret {Object} is callback 's parameter:
result {string}
:result is one of success,cancel,errordata {string}
:the selected value,the form of data is HH:mm,it exists when result is success.<template> <div class="wrapper"> <div class="group"> <text class="label">Time: </text> <text class="title">{{value}}</text> </div> <div class="group"> <text class="button" @click="pickTime">Pick Time</text> </div> </div> </template> <script> const picker = weex.requireModule('picker') export default { data () { return { value: '' } }, methods: { pickTime () { picker.pickTime({ value: this.value }, event => { if (event.result === 'success') { this.value = event.data } }) } } } </script> <style scoped> .wrapper { flex-direction: column; justify-content: center; } .group { flex-direction: row; justify-content: center; margin-bottom: 40px; align-items: center; } .label { font-size: 40px; color: #888888; } .title { font-size: 80px; color: #41B883; } .button { font-size: 36px; width: 280px; color: #41B883; text-align: center; padding-top: 25px; padding-bottom: 25px; border-width: 2px; border-style: solid; border-color: rgb(162, 217, 192); background-color: rgba(162, 217, 192, 0.2); } </style>