vue中子組件使用$emit傳值的種種情況

1、 子組件不傳遞參數，父組件也不接受參數

// 子組件
this.$emit('test')
// 父組件
@test='test'

test() {
    
}

2、 子組件傳遞一個參數，父組件接收時不帶形參

// 子組件
this.$emit('test','哈哈')
// 父組件
@test='test'

test(param) {
	console.log(param); // 哈哈
},

3、 子組件傳遞多個參數，父組件接收時需要使用arguments作為形參。arguments是一個數組。

// 子組件
this.$emit('test','哈哈1','哈哈2')
// 父組件
@test='test(arguments)'

test(params) {
	console.log(params[0]); // 哈哈1
 	console.log(params[1]); // 哈哈2
},

4、 子組件傳遞一個參數，父組件在接收參數時還加上了自己的一個屬性，那么父組件需要使用形參$event 來替代子組件傳遞的參數。

// 子組件
this.$emit('test','哈哈')
// 父組件
@test='test('呵呵',$event)'
test(myparam,param) {
     console.log(myparam); // 呵呵
     console.log(param); // 哈哈
},

5、 子組件傳遞多個參數時，父組件在接收參數時還加上了自己的一個屬性，那么父組件需要使用形參arguments 來替代子組件傳遞的多個參數。

// 子組件
this.$emit('test','哈哈1','哈哈2')
// 父組件
@test='test(arguments,'哈哈3')'
test(params,myparam) {
     console.log(params[0]); // 哈哈1
     console.log(params[1]); // 哈哈2
     console.log(myparam); // 哈哈3
},