参考:官方文档-switch
这个元件貌似默认无法使用v-model双向绑定
<switch :checked="payed" @change="switchChange" />
switchChange(e) {
//e是点击事件参数,获取里面detail.value的值
let val = e.detail.value
console.log(val);
this.payed = val
}
普通双向绑定,利用this.$set()
payed: {
checked: false
},
//已转账表格行里使用方法
switchChange(e) {
console.log(e);
let value = e.target.value
let that = this
this.$set(this.payed,"checked",value)
this.payed.checked = value
uni.showModal({
title: '提示',
content: '确定要标记为 "已转账" 吗?',
success: res => {
if (res.confirm) {
//确定的逻辑
console.log('用户点击确定')
} else if (res.cancel) {
//取消的逻辑
this.$set(this.payed,"checked",!value)
console.log('用户点击取消');
}
}
});
}
双向绑定的方法-表格里使用row(当前行,要整行)
利用的原理就是浅拷贝的原理修改原来的值。
//已转账表格行里使用方法
switchChange(row) {
console.log(row);
let value = !row.checked
let that = this
row.checked = value
uni.showModal({
title: '提示',
content: '确定要标记为 "已转账" 吗?',
success: res => {
if (res.confirm) {
//确定的逻辑
let p = {
id: row.id,
status: 3
}
console.log('用户点击确定')
} else if (res.cancel) {
//取消的逻辑
row.checked = !value
console.log('用户点击取消');
}
}
});
}