vue中v-for和v-if不能同时使用的坑

风格指南:https://cn.vuejs.org/v2/style-guide/

v-for和v-if不应该一起使用,必要情况下应该替换成computed属性。

  • 原因:v-for比v-if优先级高,所以不会执行v-if,如果每一次都需要遍历整个数组,将会影响速度,尤其是当之需要渲染很小一部分的时候。

      
    • {{ user.name }}

如上情况,即使100个user中之需要使用一个数据,也会循环整个数组。

  • 正确:

    computed: {
    activeUsers: function () {
    return this.users.filter(function (user) {
      return user.isActive
    })
    }
    }
    
    • {{ user.name }}

你可能感兴趣的:(vuejs)