vue2 实践

 
<child1 ref="child1" :msg="{name:'bill'}">

首先冒号是v-bind的缩写，不带冒号后面是字符串，带了冒号就是数据绑定，引号里面的内容是变量或者表达式,
组件内不能修改props的值，同时修改的值也不会同步到组件外层，即调用组件方不知道组件内部当前的状态是什么

如果计算属性是对象的话，可以设置他的属性。

数据可能更新了，但是没有绑定到dom上面的话，不会调用update钩子函数。

所以在这个时候应该用object.assign()重新生成新的对象。第一级属性值更新的话，data是更新的！

  style = {
              color: "rgb(66,180,232)"
       };
  //下面渲染不出来
    style = {
              color: "rgb(66,232)";
       };

vue2.0 的时候把过滤器移除了，现在2.10又加了上去，

定义filter过滤器：
写在实例Vue内部的是局部过滤器，

new Vue({
  filters:{
  formatMoney: function (value){
      return "$"+value.toFixed(2);
   }
 }
})

写在外部的是全局过滤器

Vue.filter("money",function (vaule,type) {
    return "￥" + vaule.toFixed(2) + type;
})

组件内调用：

//1.x的写法，2直接wrap('before','after')调用
Vue.filter('wrap',function (value,begin,end) {
  return begin + value + end
})

补充下：一个竖线 | 在js中是二进制运算

注意：在变异（不是替换）对象或数组时，旧值将与新值相同，因为它们的引用指向同一个对象/数组。Vue 不会保留变异之前值的副本。

如果在同一标签使用，v-if就是用来过滤v-for里面的数据的，先走if的话用template套在外面

今天并列使用的时候遇到的巨坑：

etopicclick"  v-if="mode==0"/>

结果topics只有三条数据，但是渲染出9条数据，官网说的很清楚：with v-if

即使设置了keep-alive组件的beforeUpdate和updated钩子函数还是会调用的。

activated和unactivated钩子是在keep-alive组件里面被调用的，不是第一次进入keep-alive组件的话，调用顺序是：
beforeRouteEnter->activated->beforeUpdate->beforeRouteEnter的next函数