Question

我想问你在mvc app中将事件绑定到哪里。我使用的是javascript和requirejs。

这是ProductsListView模块，它在html中呈现列表。

define([ 'jquery' ], function($) {

    function render(products, productClickEvent) {
        var list = $('#productsPanel ol');

        products.forEach(function(item) {
            var li = $('<li></li>').text(item.name).appendTo(list);
        });
    };

    return {
        render : render
    }
});

我的控制器＆＃39; ProductsListController＆＃39;看起来像这样：

define(['app/services/ProductsAjax', 'app/views/ProductsListView'],function(ProductsAjax, productsListView) {

    function renderProducts(products) {
        productsListView.render(products);
    };

    return {

        loadProducts : function() {
            ProductsAjax.getProducts(renderProducts);
        }
    }

}）;

我应该为列表元素放置事件绑定？我有解决方案在ProductsListView中添加事件绑定创建列表，只需将click事件附加到列表元素。

var li = $('<li></li>').text(item.name).click(function() {

}).appendTo(list);

Answer 1

我会使用两种不同的绑定。一个侦听DOM click，一个侦听从DOM click生成的更抽象的事件。

我会绑定到视图中的DOM click事件。它是一种视图，它知道它是如何构造的以及应该知道用户选择了产品的内容。您可以更改视图以使用不同的结构显示产品。例如，树而不是列表。然后必须以不同方式完成绑定。 视图应该负责以与其使用的结构一致的方式绑定到DOM。这会使问题分离。

DOM click事件视图中的事件处理程序应该生成一个更抽象的事件，指示“用户选择的产品X”。从具体的DOM click生成抽象事件，您可以通过多种方式选择产品，而您的应用程序的其余部分无需担心如何选择它。例如，如果添加对快捷键的支持，则可能还需要侦听键事件。通过抽象，使用点击，密钥或其他任何东西选择产品无关紧要。 然后控制器将侦听视图生成的抽象事件。

我应该在控制器或视图中放置事件绑定吗？

1 个答案: