van-action-sheet 性别选择
作者:互联网
效果图:
<van-cell title="性别" is-link :value="personInfo.stuSex == 0 ? '男' : '女'" @click="isEditGenderShow=true"></van-cell>
<van-action-sheet v-model="isEditGenderShow" :actions="actions" cancel-text="取消" close-on-click-action @cancel="isEditGenderShow = false" @select="onGenderSelect" />
// 数据
data() { return {
personInfo: {stuSex: 0 }, actions: [ { name: '男', value: 0, disabled: false }, { name: '女', value: 1, disabled: false } ], isEditGenderShow: false } },
// 方法
methods: { // 点击性别时的方法 onGenderSelect(data) { console.log(data) // 可以打印出来看看 this.personInfo.stuSex = data.value // 给性别赋值 this.isEditGenderShow = false },
}
标签:stuSex,van,性别,value,disabled,sheet,action,false,data 来源: https://blog.csdn.net/lj121829/article/details/120732020