Vue 单项数据流，dom解析等踩坑日记1：第一个参数必须为自身的值，后面可以加任意多的参数。数序颠倒就会出错。有些

过滤器踩坑

// 注册
Vue.filter('my-filter', function (value,参数) {
  // 返回处理后的值
})

// getter，返回已注册的过滤器
var myFilter = Vue.filter('my-filter')

1：第一个参数必须为自身的值，后面可以加任意多的参数。数序颠倒就会出错。

2：在vue表达式中使用管道符，过滤器会失效（比如v-html，v-text），原因是在vue2.0里管道符‘|’只能用在mousetache和v-bind中

怎么解决请尝试：

{{ article | replaceUrl }}
替换成这个
v-text="$options.filters.replaceUrl(article)"

3：在vue2.0里过滤器只能用类似函数的写法reverseString( 'I must tell you:')，括号内是参数，不同于vue1.0的用空格后加参数的写法" msg|reverseString 'I must tell you:' "

过滤器使用全局过滤器时，必须定义在 Vue实例初始化前面,否则过滤器定义无效！

对于子组件而言，父组件中自定义的过滤器在子组件中使用无效！可使用全局添加的过滤器或在子组件内部自定义过滤器！

Array发生变化以下情况无法监听到：(见官网)

不过官方提供了$set解决这些问题

解决第一类问题，以下两种方式都可以实现和 vm.items[indexOfItem] = newValue 相同的效果，同时也将在响应式系统内触发状态更新：

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)

// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)

你也可以使用 vm.$set 实例方法，该方法是全局方法 Vue.set 的一个别名：

vm.$set(vm.items, indexOfItem, newValue)

为了解决第二类问题，你可以使用 splice：

vm.items.splice(newLength)

对于修改Object的属性也应该用$set

有些 HTML 元素，诸如 <ul>、<ol>、<table> 和 <select>，对于哪些元素可以出现在其内部是有严格限制的。而有些元素，诸如 <li>、<tr> 和 <option>，只能出现在其它某些特定的元素内部。

这会导致我们使用这些有约束条件的元素时遇到一些问题。例如：

<table>
  <blog-post-row></blog-post-row>
</table>

这个自定义组件 <blog-post-row> 会被作为无效的内容提升到外部，并导致最终渲染结果出错。幸好这个特殊的 is 特性给了我们一个变通的办法：

<table>
  <tr is="blog-post-row"></tr>
</table>

使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) ，如果你使用字符串模板组件，那这个限制就没有了。

<!-- 在 HTML 中是 kebab-case 的 -->
<blog-post post-title="hello!"></blog-post>