Question

我想知道在亲子关系中应该设置哪些事件。这不是一个特定的问题，只是我猜的最佳实践。我的具体案例：

我有Dropdown，其中包含Button和List。描述操作，按下按钮，出现列表。单击列表中的项目，该项目被选中，列表消失。

首先，由于视图初始化为Dropdown，因此制作该视图的人不需要进入并处理Button或List视图。应该在父视图上调用所有方法，并且可能需要从子视图中冒充出事件。

例如，代替执行：this.dropdown.button.press();，Dropdown提供了自己的press方法，只调用Button的按下方法。

当用户按下按钮时，Button会触发press正在收听的Dropdown个事件。

onButtonPress : function () {

    if (!this.isExpanded()) {
        this.expand();
    }

    this.trigger('press');
},

并且Dropdown触发器按下它自己，这样开发者就可以在不进入dropdown.button的情况下获取新闻事件。

这是第一个问题的来源。 Dropdown应该onButtonPress展开，或者onButtonPress应该触发新闻，然后让扩展听取Dropdown自己的press事件：

onButtonPress : function () {

    this.trigger('press');
},

onPress : function () {

    if (!this.isExpanded()) {
        this.expand();
    }
},

然后它变得更复杂，Dropdown的{{1}}方法只会触发expand：

expand

或应该是expand : function () { if (this.isEnabled()) { this.setState('expanded', true); this.trigger('expand'); } return this; }, onExpand : function () { this.list.show(); }, show：

的那个

List

我想我只是想知道决定在父/子关系中绑定事件的位置的最佳实践。如何避免混淆情况和可能的循环事件调用。

有人有任何想法吗？

Answer 1

我只是简单地使用DOM而不是手动触发事件。如果您希望事件首先命中父项，则将捕获设置为true，如果您希望事件冒泡，则设置为false。

这允许在捕获阶段调用事件处理程序，因此父DOM元素首先获取事件：

el.bind('someevent', somefunction, true);

这个气泡，因此孩子们首先接受事件，并且当孩子们接收事件时调用处理程序。

el.bind('someevent', somefunction, false);

一般来说，保持简单。您还可以使用委托编程模式，其中父级将为自己和子级获取事件，因此您可以避免混淆，并可能使用更大的应用程序来节省内存。

父对子视图事件绑定关系

1 个答案: