小程序 triggerEvent 使用

   2025-02-20 7420
核心提示:小程序的triggerEvent方法用于触发一个组件上的自定义事件,并传递参数给事件处理函数。使用方法如下:在组件内部定义一个自定义

小程序的triggerEvent方法用于触发一个组件上的自定义事件,并传递参数给事件处理函数。

使用方法如下:

在组件内部定义一个自定义事件,可以在组件的properties中定义一个名为customEvent的属性:
Component({properties: {customEvent: {type: null,value: null,observer: function(newVal, oldVal) {this.triggerEvent('customEvent', newVal);}}},methods: {// 自定义事件处理函数handleEvent: function(event) {console.log(event.detail);}}})
在页面中使用该组件,可以通过设置组件的customEvent属性来触发自定义事件:
<custom-component customEvent="{{data}}"></custom-component>
在页面的js文件中,可以监听组件上的自定义事件并处理:
Page({data: {data: 'Hello World',},// 监听组件上的自定义事件handleEvent: function(event) {console.log(event.detail); // 输出:Hello World}})

在上述示例中,当组件的customEvent属性变化时,会触发组件内部的observer方法,该方法会调用triggerEvent方法触发自定义事件,并将customEvent的新值作为参数传递给事件处理函数handleEvent。在页面的handleEvent方法中,可以通过event.detail获取到传递的参数。

 
 
更多>同类维修知识
推荐图文
推荐维修知识
点击排行
网站首页  |  关于我们  |  联系方式  |  用户协议  |  隐私政策  |  网站留言