vue购物车项目遇到的知识点

1、vue图片静态路径可以加载成功，但是List里面的src属性动态赋值，图片无法显示

解决：require("@/img/xxx.png")

2、路由跳转传递的参数可以是对象吗

可以；使用params传递参数

缺点： params中的参数一刷新数据就没了。

3、购物车中，点击增加数量，只对当前物品进行小结计算，vue的v-for循环中item中的对象数据的处理怎么挪入computed中来计算。

因为computed不能携带参数，但是需要把当前Index传递进去，去计算金额，使用methods来代替

   getTotalPrice(){
      for (var i = 0; i < this.cartLists.length; i++) {
        var item = this.cartLists[i];
        if (item.select) {
          this.totalPrice += (item.price * item.num);
          console.log(this.totalPrice)
        }
     }
    },
    add(index) {
       this.cartLists[index].num++;
       this.getTotalPrice();
    },

4、input的focus和click事件冲突，click的事件一直不触发

原因：事件的发生次序：mousedown===>foucus====>mouseup====>click

解决：用mousedown代替click

在外面包裹元素，把搜索按钮绝对定位在input框之外，

5、禁止出发点击事件的css

pointer-events:none 

６、vue根据传参动态显示组件

 <component v-bind:is="currentBizComponent"></component>

通过改变this.currentBizComponent的属性来使组件动态展示

7、computed计算当前商品的星级时，需要根据评分计算出一个含有5个类名的数组。这个需要使用computed，传参，可以利用闭包传参。