迪朗达尔/淘汰赛。更新其他视图/ viewmodel

Posted 2021-05-05

Durandal有一个名为shell的基本视图。

我在其上添加了一个搜索框，以允许管理员/质量保证用户模仿任何系统用户。在按钮上单击我希望能够更新当前显示的视图的视图。

• 壳牌（蓝色）查看（红色）

我将如何进行，在我的子视图上公开一个函数，以便我可以从shell调用它，或从子视图挂钩到shell的按钮单击事件。

题：

Durandal是否公开了我可以使用的钩子来冒泡或将事件传递给不同的视图或父容器？

答案

假设您有多个子视图并且不想在shell和子代之间引入依赖关系，那么最好使用Durandal的事件系统。 shell视图将成为发布者和子视图订阅者。

查看http://dfiddle.github.io/dFiddle-1.2/#/event-aggregator/dFiddle的工作演示。

publisher.js

define(['durandal/app'], function (app) {

    var message = ko.observable();
    var canPublish = ko.computed(function () {
        return message() ? true : false;
    });

    return {
        message: message,
        canPublish:canPublish,
        publish: function () {
            app.trigger('sample:event', message());
        }
    };
});

subscriber.js

define(['durandal/app'], function (app) {

    return {
        received: ko.observableArray([]),
        subscription:ko.observable(),
        subscribe: function () {
            var sub = app.on('sample:event').then(function(message) {
                this.received.push(message);
            }, this);

            this.subscription(sub);
        },
        unsubscribe: function () {
            this.subscription().off();
            this.subscription(null);
        }
    };
});

可以考虑的其他选择

• 一个共享模块，它返回一个包含应在父/子之间共享的属性的单例。缺点需要在所有父/子中定义为依赖。
• 一个例如全球带有属性的myApp ...缺点：暴露全局