Vue过滤器

值全部更新了，这时候做的更新是没有必要的，就像没有加key一样，因此index虽然能够解决key不冲突的问题，但是并不能解决复用的情况。如果没有唯一ID的情况下，可以使用用组件的uid拼接index的形式，因为uid是唯一

的。或者生成一个时间戳~。

总结

关于在 v-for 中使用 key 是因为使用 key 相当于给节点添加上一个唯一的 id，在 DOM DIFF算法中能更高效的更新虚拟DOM。

当没有使用的时候，如果我们需要对一个循环渲染的列表插入一个，那么实际上会 “就地复用” 的策略，比如我们需要在最前面插入一个，那么就会后面的全部往后变更，发生多次DOM操作，这是因为 Vue无法跟踪每个节点，

而使用 key 后，节点标识，定位到最前面，然后插入修改，只发生一次DOM操作，大大优化了性能。

Vue过滤器

定义过滤器有两种常见的方式: 双花括号插值和 v-bind 表达式

<!-- 在双花括号中 --> {{ message | capitalize }}

<!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId"></div>

其实一般用来格式文本，比如我们往往拿到的时间是时间戳，那么就可以很简单的通过过滤器来格式成我们常见的格式。

使用上的我们先要定义过滤的方法，这个可以全局定义或者组件内定义

//组件内定义 filters: {

capitalize: function (value) { if (!value) return ''

value = value.toString()

return value.charAt(0).toUpperCase() + value.slice(1)

} }

//全局定义 Vue.filter('capitalize', function (value) {

if (!value) return '' value = value.toString()

return value.charAt(0).toUpperCase() + value.slice(1)

})

new Vue({ // ...

})