文章插图
文章插图
没有传值默认为false
文章插图
动态绑定checked
文章插图
2.3 修改勾选状态这里的思路是这样的先给组件来一个自定义事件
文章插图
回顾一下vue的自定义事件的参数e是对面传过来的参数 , 只有原生事件才是事件对象
文章插图
然后组件这边真正的change事件
文章插图
将id和状态传过来
文章插图
传过来之后应该修改state状态,但是要在vuex里面修改,为什么,因为我们的这些数据数组都是从里面拿过来的所以要在源头上修改
文章插图
找到后将其取反
文章插图
将参数传进来即可
文章插图
2.4 numberBox这个是uni的一个组件,展示加减数量的
使用这个组件,固定最少为1,并把默认值改为我们添加购物车的数量
文章插图
然后就是让他在特定区域才显示
文章插图
2.5 num-change我们的numberBox虽然可以加减变化 , 但是我们的父页面并没有检测到变化,所以购物车badge也没有对应的更新
需要改造一下这个事件
他有一个change事件 , 参数就是当前改变的值
文章插图
文章插图
这边接受数据,并传到vuex进行修改
文章插图
2.6 左滑删除用到uni的一个组件
uni-swipe-action
改造之前的代码
文章插图
记得options需要在data中来定义
文章插图
给她来一个点击事件
文章插图
点击删除就这一项筛选出去
文章插图
2.7 收货地址2.7.1 封装my-adress【04 uniapp/微信小程序 项目day04】
文章插图
父组件展示出来
文章插图
定义好下面边界线 , 和点击新增地址区域
文章插图
文章插图
然后是我们的地址区域
文章插图
他们两个应该来一个vif velse显示隐藏 , 判断依据就是有无adress这个地址信息对象
文章插图
注意这里必须转为json再去对比是否是空对象 , 因为原来也说过,空的对象返回的值是true,所以这里要转换成字符串来比较
文章插图
2.7.2 选择收货地址会用到一个uni的api专门用来获取用户的收货地址
uni.chooseAddress(OBJECT)
点击新增就会进来
文章插图
要注意这个api返回的是一个promise所以用async、await来接受
推荐阅读
- 关于.Net和Java的看法-一个小实习生经历
- 金铲铲之战小小阿卡丽多少钱
- 小米手机和华为手机哪个好_小米耐用还是华为耐用
- 微信小程序canvas 证件照制作
- 小米盒子4s pro评测_小米盒子4s pro怎么样
- 小米11ultra和小米11pro参数_参数配置详情对比
- 小度智能屏x10不插电源可以用吗?
- 小米11ultra怎么读取u盘_读取u盘方法教程
- iqoo8pro和小米11ultra区别对比_哪款更值得入手
- 北京市小客车指标中签查询 北京市小客车指标查询