父子组件间的通信
- 父组件 => 子组件 ：通过
props属性 - 子组件 => 父组件： 通过
$emit触发事件
父传子
我们可以通过props来完成组件之间的通信
props是什么？
- props是你可以在组件上
注册一些自定义的attribute - 父组件可以给
这些attribute赋值，子组件通过attribute的名称获取到对应的值
props有两种常见的用法：
- 方式一：字符串数组，数组中的字符串就是attribute的名称
- 方拾二：对象类型；对象类型我们可以在指定props名称的同时，指定它需要传递的类型，是否是必须的，默认值
props的数组用法
//子组件-showMessage <template> <div>组件展示的title:{{title}}</div> <div>组件展示的content:{{content}}</div> </template> <script> export default { props:["title", "content"] } </script> // 父组件 <template> <div> <show-message title="heihei" content="this is a boring boy"> </show-message> </div> </template>
props的对象用法
数组用法只能传入attribute的名称，并不能对形式做限制和传入默认值
- 指定传入的
attribute的类型 - 指定传入的
attribute是否是必传的 - 指定没有传入时，
attribute的默认值
export default { props:{ //指定类型 title: String, //指定类型 同时指定是否必选，默认值 content: { type: String, require: true, default:"哈哈哈" } } }
