一、前言
1、计算总金额
2、点击删除按钮，删除对应的商品信息
3、当还没结算的时候，当用户跳到其他页面时，提示用户是否要离开
二、主要内容
1、计算总金额
（1）效果演示：
（2）监听多个属性用到computed计算属性
computed:{ payment(){ let total = 0;//定义总金额 let count =0;//定义总数量 this.shopCart.forEach((shop)=>{ if(shop.isSelected){//当上面的按钮勾上了，才计算 count = count+shop.num; total = total + shop.num * shop.sell_price; } }) return { total, count } } },
2、点击删除按钮，删除对应的商品信息
删除操作可以用splice, delete
del(shop,index){//将当前的对象，和index传进来
this.shopCart.splice(index,1)//数组中的当前对象
}
3、当还没结算的时候，当用户跳到其他页面时，提示用户是否要离开
（1）用导航守卫，在路由离开之前给用户提示
beforeRouteLeave(to, from, next){ let res = confirm("确定要离开吗"); if(res){ //保存用户编辑的数据 let obj={}; this.shopCart.forEach((shop)=>{ obj[shop.id]=shop.num }) GoodsTool.saveGoods(obj); next();//然后放行 }else{ next(false);//取消， } }
三、总结