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

最新推荐文章于 2024-05-12 23:32:13 发布

赵圆圆

最新推荐文章于 2024-05-12 23:32:13 发布

阅读量631

点赞数

分类专栏： Vue+ElementUI

本文链接：https://blog.csdn.net/ZYY88886666/article/details/78843860

版权

5 篇文章 0 订阅

订阅专栏

data必须是函数

在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（自定义函数）属性

关注