《踩坑记录》因为粗心导致的购物车页面选择框各种无效问题

跟随学习资源编写的电商网站,做到购物车页面。动态绑定以及功能不熟悉,从视频中学习之后开始自己的代码。结果一直从四点多忙活到现在才完成。。。。

首先是click写成cilck导致勾选单件商品没有反应。功能逻辑正确应该是使用if语句先判断第二个参数传入的是“+”还是“-”,然后再各自分出if语句和else语句,if语句判断是否只有一个商品或者是超出库存,else语句执行正常的加减。我按照我的理解写成使用if语句判断传入是"-"执行判断是否最后一个,不是的话减一个商品,是的话弹出提示;然后else if语句判断是否超出库存,是弹出提示,否加一个商品,所以如果是正常添加不超出库存非最后一个商品时是没有反应的。。。

第二个问题,视频中的标签用的是div,动态绑定class的名称,通过接口返回的值作为class,切换div标签的class以达到改变样式。我自己是用input 加type=checkbox,然后绑定的时候也用视频的方法v-bind:class="{'checked':item.productSelected}",先是一点点查代码是否有拼写错误,有去看接口返回的值是否有问题,再看绑定的语句时才发现直接 v-bind:checked=allChecked就完事了。。。

其实报错也不是什么大事,静下心来慢慢去排查还是很好检查出问题的,特别是看到自己写的代码能没任何问题跑起来,一切都感觉是值得的,虽然现在的付出好像和预期的还不是这么对等。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值