使用uni-app 制作微信小程序 ,在做购物车的时候发现没有合适的单选和多选组件 ,然后只能自己想办法了。
我就准备了两张图片 一个选中 一个未选中
然后用一个三元表达式 判断展示哪张图片
:src="ischecked[index] ? '/static/check/checked.png?': '/static/check/unchecked.png'"
发现布尔值改变后页面展示按钮不会变化
checked(index) {
this.ischecked[index] = !this.ischecked[index]
},
然后加个刷新
checked(index) {
this.ischecked[index] = !this.ischecked[index]this.$refs.udb.refresh()
}
这是可以展示了 但是体验很差 ,每次页面都会闪烁一下
全选方法执行完后加个return 发现图片会变化 ,不加return就不会 有没有大佬告诉我为什么 ,单选方法加了return又不会变化 。
checkedAll() {
if (this.ischeckedall == false) {
for (var i = 0; i < this.ischecked.length; i++) {
if (this.ischecked[i] != true) {
this.ischecked[i] = true
}
}
this.ischeckedall = true
return;
}
if (this.ischeckedall == true) {
for (var i = 0; i < this.ischecked.length; i++) {
this.ischecked[i] = false
}
this.ischeckedall = false
return;
}
}
麻了
完全搞不懂为啥
下面这段代码 在布尔值改变后 对应的图片不会更新
checked(index) {
if (this.ischecked[index]) {
this.ischecked[index] = false
this.ischeckedall = false
return
}
this.ischecked[index] = true
},
但是加上 this.settlement() 方法后又会自动对应更新图片
checked(index) {
if (this.ischecked[index]) {
this.ischecked[index] = false
this.ischeckedall = false
this.settlement()
return
}
this.ischecked[index] = true
this.settlement()
},
但是 this.settlement() 方法里面没有更新数据 如下
只是进行了计算而已
settlement() {
this.totalPrice = 0
for (var i = 0; i < this.ischecked.length; i++) {
if (this.ischecked[i] == true) {
this.totalPrice += this.$refs.udb.dataList[i].goods_id[0].goods_price
}
}
}
有没有大佬懂 求教