阿里云赞助

picker

picker

v0.9+

Summary

A series of stream api. It provides function: pick data,pick date,pick time

API

pick(options, callback[options])

pick data(single column)

Arguments

  • options {Object}:pick options

    • index {number}:default selected row
    • items {array}:picker’s data
  • callback {function (ret)}:the callback function after executing this action.ret {Object} is callback ‘s parameter:

    • result {string}:result is one of success,cancel,error
    • data {number}:the selected index,it exists when result is success.

pickDate(options, callback[options])

pick date

Arguments

  • options {Object}:pick date options

    • value {string}:Required,date picker selected value by default,date’s form is yyyy-MM-dd
    • max {string}:optional,date’s max value
    • min {string}:optional,date’s min value
  • callback {function (ret)}:the callback function after executing this action.ret {Object} is callback ‘s parameter:

    • result {string}:result is one of success,cancel,error
    • data {string}:the selected value,the form of data is yyyy-MM-dd ,it exists when result is success.

pickTime(options, callback[options])

pick time

Arguments

  • options {Object}:pick time options

    • value {string}:required,the form of value is HH:mm
  • callback {function (ret)}:the callback function after executing this action.ret {Object} is callback ‘s parameter:

    • result {string}:result is one of success,cancel,error
    • data {string}:the selected value,the form of data is HH:mm,it exists when result is success.

Example

<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>
Apache Incubator
Disclaimer: Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.


ApacheCopyright(c) 2017 The Apache Software Foundation. Licensed under the Apache License, Version 2.0