vue笔记 ---组件之间的通信

  1. 父组件向子组件传值:props中如果值是一个数组或者对象,默认值必须是一个工厂函数,否则报错。
props: {
	msgInfo: {
		type: Array,
		required: true,
		default: function(){
			return []
		}
	},
	msg1: [string, number]   //msg1既可以是字符串也可以是number
}

父组件中绑定props值要用短横线格式:

<comList :mag-info="message"></comList>
  1. 子组件向父组件传值:子组件触发一个事件,父组件监听该事件。
子组件中:this.$emit('msgClick'); //第一个参数为自定义事件名称,第二个参数为自定义事件的参数
父组件中:<comList @msgClick="fatherClick"></comList>  //fatherClick定义在父组件的methods中
  1. 父组件访问子组件的方式
使用 this.$children[0].name(用的比较少)this.$ref.reference(用的比较多)
  1. 子组件访问父组件的方式
使用 this.$parent.name
  1. 组件通过 this.$root 访问根组件vue实例
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页