仅限于值比较少的情况,如果点击想显示的列比较多,就用我的另一篇博客中写的(mt-cell结合mt-popup和mt-picker的使用)
html代码片段:
<mt-cell title="性别" is-link :value="sexVal" @click.native="sexClick()"></mt-cell>
<mt-actionsheet cancel-text :actions="sexActions" v-model="sexVisible"></mt-actionsheet>
data代码片段:
//鉴于性别只有两个值,所以我这块儿就根据后台性别的id值,将数据写死了(仅限于值比较少的情况)
sex: '', //性别的唯一标识(id/type)
sexVal: '', //性别的值
sexVisible: false,
sexActions: [
{
id: '0',
name: '男',
method: this.select
},
{
id: '1',
name: '女',
method: this.select
}
],
methods代码片段:
sexClick () {
if (this.isQiye) {
this.sexVisible = true
} else {
this.sexVisible = false
}
},
select (item) {
this.sex = item.id
this.sexVisible = false
this.sexVal = item.name
}