vue列表渲染

说到列表渲染能想到什么？

列表渲染v-for（搞懂数组循环，对象循环，字符串循环） > 数据增删改查操作 > 唯一标识性key > 虚拟DOM的原理。

主要分析key和虚拟DOM

数据在新增或删除等操作时虚拟DOM中唯一标识性key的作用：

追踪列表中哪些元素被添加、被修改、被移除的辅助标志。

vue会根据新数据生成的新的虚拟DOM与原来的虚拟DOM进行差异比较，差异比较如下：

   旧虚拟DOM中找到了与新虚拟DOM相同的key: 
      ①.若虚拟DOM中内容没变， 直接使用之前的真实DOM! 
      ②.若虚拟DOM中内容变了，则生成新的真实DOM，随后替换掉页面中之前的真实DOM。

   旧虚拟DOM中未找到与新虚拟DOM相同的key：
      创建新的真实DOM，随后渲染到到页面。

index作为key的唯一标识可能引发的问题：

   对数据进行不按顺序的添加或删除等破坏顺序结构的操作时：

      产生没必要的真实DOM更新，影响效率，而且如果结构中还含有按钮输入框等东西就会产生错误的DOM更新，导致界面有问题。

---

列表过滤filter（模糊查询）

计算属性computed或监视属性watch来实现列表的模糊查询

   (计算属性有两种写法，一种是写完整的配置对象，一种是简单的函数)