微信小程序 自定义组件中 triggerEvent() 函数失效的一种情况 (Cannot read property ‘triggerEvent‘ of undefined)

在网络上并没有搜索到这种情况,这里记录下避免以后的自己和广大码农踩到这个坑

问题描述:在自定义组件中想调用 this.triggerEvent()函数给父组件传参,过程中报错:Cannot read property ‘triggerEvent’ of undefined

原因之一:组件的方法的格式错误(函数编写格式错误)见代码
解决方法:修改为正确格式 见代码

//header.js  组件中的js代码片段  错误示例

Component({
 /**
   * 组件的方法列表
   */
	methods: {
   	//下面是一个触发事件后绑定的函数,想要通过triggerEvent将数据传到父组件
    onChangeLocation:(event) => {	//这里格式错误,使用箭头函数后编译器不能识别triggerEvent()函数
    	let message = "我是要传到父组件的消息";
    	console.log(message");	//可以正常打印,说明使用箭头函数可以执行里面的代码
        this.triggerEvent("locationChange",{message});	//出错,说明箭头函数会导致部分函数无法被编译器识别
        }
      })
    },
  }
})


//正确示例1  官方文档的格式

Component({
 /**
   * 组件的方法列表
   */
	methods: {
    onChangeLocation(event) {	
    	let message = "我是要传到父组件的消息";
    	console.log(message");	//正常打印
        this.triggerEvent("locationChange",{message});  //执行成功	
        }
      })
    },
  }
})


//正确示例2  可以正确执行但格式与官方文档格式不同

Component({
 /**
   * 组件的方法列表
   */
	methods: {
    onChangeLocation:function(event) {	
    	let message = "我是要传到父组件的消息";
    	console.log(message");	//正常打印
        this.triggerEvent("locationChange",{message});  //执行成功	
        }
      })
    },
  }
})

你可能感兴趣的:(微信小程序日记,javascript)