$emit参数读取方式 $event、arguments

1: $event 常用于单个参数emit, 且父组件中的响应函数需要用到本身的指定的数据(如列表中的index)
其实子组件也可以通过对象存储多个传参,然后用单个对象传递
代码如下:

// 子组件中:
onChange(value){
	this.$emit('onChangeFn', value)
}

// 父组件中:
<childenComponents 
	@onChangeFn="FnName($event, index)">
</childenComponents>
FnName(childData, index){
	this.list[index].value = childData;
}

2: arguments 用于子组件中有多个参数返回,且父组件中的响应函数需要用到本身的指定的数据(如列表中的index)

// 子组件中:
value1= '';
value2= '';
onChange(){
	// 可以有任意个参数,这里举例用了两个
	this.$emit('onChangeFn', this.value1, this.value2)
}

// 父组件中:
<childenComponents 
	@onChangeFn="FnName(arguments, index)">
</childenComponents>
FnName([value1, value2], index){
	this.list[index].value1 = value1 ;
	this.list[index].value1 = value2;
}

你可能感兴趣的:(vue,js,javascript,html5,html)