vue基础

[jiaozitang]

v-bind:class=""

当在一个自定义组件上使用 class 属性时，这些类将被添加到该组件的根元素上面。这个元素上已经存在的类不会被覆盖。

[jiaozitang]

v-if

用 key 管理可复用的元素，v-if 切换 v-else页面显示的内容不会清除用户已输入的内容，因为input元素被复用了，如果希望这两个元素是独立的，不被复用。加上不同的key值就可以了

当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级。

[jiaozitang]

v-for

当 Vue.js 用 v-for 正在更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue 将不会移动 DOM 元素来匹配数据项的顺序， 而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。可以在渲染对象时为每个项添加一个key。

不是很理解不会移动DOM元素是什么意思

数组排序和过滤 排序：

arraySort(arr,key){//对象数组排序
    return arr.sort(function (a,b) {
      if(a[key]>b[key]){
        return 1;
      }else if(a[key]<b[key]){
        return -1;
      }else{
        return 0;
      }
    })
  },
  arrSort2(arr){//数组排序
    return arr.sort(function (a,b) {
      if(a>b){
        return 1;
      }else if(a<b){
        return -1;
      }else{
        return 0;
      }
    })
  }

组件中的v-for 任何数据都不会被自动传递到组件里，因为组件有自己独立的作用域。为了把迭代数据传递到组件里，我们要用 props

[jiaozitang]

v-on

有时也需要在内联语句处理器中访问原始的 DOM 事件。可以用特殊变量 $event 把它传入方法：

<button @click="test($event)"></button> 
 test(event){
    console.log(event);
    // 现在我们可以访问原生事件对象
    if (event) event.preventDefault()
}

[jiaozitang]

v-model

建议都给定一个初始值

[jiaozitang]

组件基础

Prop 是你可以在组件上注册的一些自定义特性，当一个值传递给一个 prop 特性的时候，它就变成了那个组件实例的一个属性。可以使用 v-bind 来动态传递 prop。 每个组件必须只有一个根元素。 父组件传给子组件：代码路径（https://github.com/tang119/Vuejs-note/blob/master/components/News.vue） 子组件传给父组件： 自定义事件$emit 方法并传入事件的名字，来向父级组件触发一个事件

在组件上使用 v-model代码： https://github.com/tang119/Vuejs-note/blob/master/components/vModel.vue