vueJS组件笔记（针对.vue组件）

data必须是函数

详见尤大大：
https://cn.vuejs.org/v2/guide/components.html#DOM-%E6%A8%A1%E6%9D%BF%E8%A7%A3%E6%9E%90%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9

在data函数中，我们可以通过为每个组件返回全新的数据对象，这样不会污染其他组件。

data (){      var data = {        flag:true      }      return data;    }

组件组合

父子组件之间通信就要解耦。父子组件的关系可以总结为 prop 向下传递，事件向上传递。父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息。

• 单向数据流
  每次父组件更新时，子组件的所有 prop 都会更新为最新值。这意味着你不应该在子组件内部改变 prop。但是如果想改变父组件传来的值怎么办呢？

  • 1.定义一个局部变量，并用 prop 的值初始化它：

    props: ['data'],data: function () {  return { data: this.data }}

    注意： return { data: this.data } 里面的data是.vue组件使用的绑定值，而this.data 是来自于父组件传递的值 。

  • 2.定义一个计算属性，处理 prop 的值并返回：

    props: ['size'],computed: {  normalizedSize: function () {    return this.size.trim().toLowerCase()  }}

• 绑定自定义属性写法 在

• 在子组件中通过this.xxx使用
  props里面有 type（值的类型String，Number，Boolean，Function，Object，Array，Symbol）,default（值的默认值）， required（ 必传值Boolean类型），validator（自定义函数）属性