【odoo15】解读前端this.trigger()、this.trigger

2024-07-21 1081阅读

概要

        在Odoo 15的前端开发中,this.trigger()、this.trigger_up() 和 bus 是三种常见的事件处理机制。它们在不同的上下文中使用,适用于不同的场景。

【odoo15】解读前端this.trigger()、this.trigger
(图片来源网络,侵删)

内容

this.trigger()

 作用:

用于在当前对象或组件上触发一个事件。该事件只会在当前对象或组件的上下文中被监听和处理。

使用方式:
//监听事件
this.on('event_name', this, this._onTypingMessageAdded);
或
this.el.addEventListener('event_name', this.refresh_select_line_id.bind(this));
或
custom_events: Object.assign({}, KanbanController.prototype.custom_events, {
    event_name: '_onBarcodeScannedHandler',
}),
//调用
this.trigger('event_name', {param1: value1, param2: value2});
使用场景:

适用于在当前组件内部的事件通信。例如,当一个组件的某部分状态发生变化时,需要通知组件的其他部分进行相应的更新。

this.trigger_up()

 作用:

用于向父组件或父对象触发一个事件。该事件会沿着组件树向上冒泡,直到到达顶层组件或被某个中间组件处理。

使用方式:
//监听事件
custom_events: _.extend({}, FormController.prototype.custom_events, {
    activeBarcode: '_barcodeActivated',
})
//调用
this.trigger_up('activeBarcode', {
    name: this.name,
    commands: {
        barcode: '_barcodeAddX2MQuantity',
    }
});
使用场景:

用于在组件层级之间的事件通信。例如,当一个子组件需要通知父组件某个事件(如用户操作)发生时,可以使用 this.trigger_up() 将事件向上传播,让父组件处理该事件。

bus()

 作用:

一个全局事件总线(event bus),用于在不同组件或模块之间进行通信。通过 bus,你可以在应用的不同部分之间发送和接收事件。(类似订阅事件)

使用方式:
import core from 'web.core';
//订阅事件
mounted() {
    core.bus.on('add_move_lines', this, this.onAddRecordOpenDialog);
}
//取消订阅
willUnmount() {
    core.bus.off('add_move_lines', this, this.onAddRecordOpenDialog);
}
//触发
core.bus.trigger('add_move_lines', value.ids);
使用场景:

用于在应用程序的全局范围内进行通信。例如,在不同模块之间传递信息,或在应用的不同部分之间广播全局事件。

注:trigger跟trigger_up用法其实大同小异,但是bus在组件卸载时记得取消订阅,不然容易导致内存泄漏等问题。

小结

        多写多敲多思考,毕竟,知己知彼才能看懂源码。

Tip:本人才学尚浅,如有纰漏,还请不吝赐教!

VPS购买请点击我

免责声明:我们致力于保护作者版权,注重分享,被刊用文章因无法核实真实出处,未能及时与作者取得联系,或有版权异议的,请联系管理员,我们会立即处理! 部分文章是来自自研大数据AI进行生成,内容摘自(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供学习参考,不准确地方联系删除处理! 图片声明:本站部分配图来自人工智能系统AI生成,觅知网授权图片,PxHere摄影无版权图库和百度,360,搜狗等多加搜索引擎自动关键词搜索配图,如有侵权的图片,请第一时间联系我们,邮箱:ciyunidc@ciyunshuju.com。本站只作为美观性配图使用,无任何非法侵犯第三方意图,一切解释权归图片著作权方,本站不承担任何责任。如有恶意碰瓷者,必当奉陪到底严惩不贷!

目录[+]