vue父子组件之间props的数据通信
发布网友
发布时间：2023-01-15 10:38
共1个回答
热心网友
时间：2023-01-23 16:48
1、比如在一个页面中,我们从服务器请求到了很多的数据。
2、其中一部分数据,并非是我们整个页面的大组件来展示的,而是需要下面的子组件进行展示。
3、这个时候,并不会让子组件再次发送一个网络请求 ,而是直接让大组件(父组件)将数据传递给小组件(子组件)。
父组件是通过props向子组件传递数据的
子组件是通过事件$emit向父组件发送信息的
props信息传递过程
①在组件上v-blind一个自定义属性，并将父组件的数据变量名字赋值给这个属性,(可以定义多个属性绑定数据)
<com v-blind:childrenname="name" v-blind:childrenage="age"> </com>
②在组件的上增加props属性，属性的名字就是组件上自定义的属性名
props：[‘childrenname’,'childrenage']
props支持自定义验证和自定义验证类型
①自定义验证函数，需要使用validator属性
props：{
children:{ validator:function(value){ rerurn }}
}
如果不符合验证要求会报错 ：Invalid prop: custom validator check failed for prop "cmessage".
found in
②自定义验证类型
