JS 视图中的可观察助手

【问题标题】：Observable helpers in JS ViewsJS 视图中的可观察助手
【发布时间】：2016-03-04 00:39:44
【问题描述】：

我正在尝试基于可观察到的元素更新给助手。

可观察：

var siteGlobal = {
    page: null,
    parent: null
};

助手

$.views.helpers({
    navState: function(id) {
        var cssClass = "nav_item";
        if (Number(id) === siteGlobal.parent) {
            cssClass += " current_page_parent";
        } else if (Number(id) === siteGlobal.page) {
            cssClass += " current_page_item";
        }
        return cssClass;
    }
});

$.views.helpers.navState.depends = [siteGlobal, "parent"];
$.views.helpers.navState.depends = [siteGlobal, "page"];

元素

<li data-link="class{:~navState(id)}" >...</li>

所以想法是，当可观察对象发生变化时，助手会做出响应，比较链接元素提供的值。

【问题讨论】：

标签： observable jsviews

【解决方案1】：

是的，这会起作用。

你需要

$.views.helpers.navState.depends = [siteGlobal, "parent", "page"];

现在如果id 是3，你打电话

$.observable(siteGlobal).setProperty("page", 3);

然后类将设置为"nav_item current_page_item"

打电话

$.observable(siteGlobal).setProperty("parent", 3);

它会被设置为"nav_item current_page_parent"

见www.jsviews.com/#computed@depends。

【讨论】：