销毁事件，或将外部 DOM 项目链接到 Backbone 模型

Question

我正在为 Weebly. Weebly wraps each element in a Backbone JS view, as explained here 创建拖放元素。

// My js file. PlatformElement is a Weebly-controlled object exposed to me.
PlatformElement.extend({
    initialize: function() {
        // Weebly calls this method automatically at element creation time.
        // This is where I add a new menu item to an external navigation menu.
    }
});

当 Backbone 视图为 initialized 时，我将新的 DOM 节点添加到外部导航菜单。我的问题从这里开始：当我的模型被销毁时，我创建的 DOM 节点仍然存在。

Weebly destroys/recreates 每次用户在 Web 设计器界面中重新配置我的元素时的视图。我的外部菜单节点没有被销毁，因为它不是模型的一部分，而且我的 JS 不知道 destory 事件以手动删除菜单节点。

当然，这意味着对我的元素的每次更改都会创建另一个重复的菜单节点。

问题:

是否有 Weebly 向我公开的事件或本机 Backbone 功能向我公开，让我知道我的模型正在被破坏？
或者，有没有办法 "link" 我的外部菜单节点到我的模型，这样当我的模型被销毁时，菜单节点也会被销毁？

Answer 1

Backbone 确实提供了侦听发生在 Backbone 对象（模型、视图、集合...）上的事件的方法。要监听模型的销毁事件，您可以：

const model = new Model({/*...*/});

// solution 1
model.on('destroy', () => console.log('model is destroyed'));

// soluction 2
const view = new View({/*...*/});
view.listenTo(model, 'destroy', () => console.log('model is destroyed'));

model.destroy(); // this will trigger two callbacks above

销毁事件，或将外部 DOM 项目链接到 Backbone 模型

Destroy event, or linking external DOM item to Backbone model

javascript

backbone.js

backbone-views

backbone-events

weebly