javascript - 我不想两次调用自定义函数

Question

我正在创建一个 <li></li>列出我循环遍历 projects 列表的位置，如果该元素存在于 myProjects 中，我会突出显示该背景。

我需要使用这个函数两次，一次用于背景属性，一次用于边框属性。但对我来说，运行它两次似乎是多余的，那么有没有办法将对象返回到 View 并在那里使用它两次？还是有其他解决方法？

也许这不会对加载时间产生太大影响？

型号

var vm = {
    myProjects: ko.observableArray(),
    projects: ko.observableArray(),
    inMyProjects: function (id) {
        var match = ko.utils.arrayFirst(vm.myProjects(), function (item) {
            return item.ProjectId() === id;
        });
        return match != null ? '#EEE' : '#777';
    }
};

查看

<ul class="projects" data-bind="foreach: projects">
    <li data-bind="text: Description, style: {
        backgroundColor: $parent.inMyProjects(ProjectId()),
        borderColor: $parent.inMyProjects(ProjectId())
    }">
    </li>
</ul>

Answer 1

使 inMyProjects 返回一个对象而不是值并重用其中的值:

变量 vm = { 我的元素:ko.observableArray(), 元素:ko.observableArray()， 在我的元素中:函数(id){ var match = ko.utils.arrayFirst(vm.myProjects(), function (item) { 返回 item.ProjectId() === id; }); 变种结果=匹配!=空？ '#EEE' : '#777';

    return {
        backgroundColor: result,
        borderColor: result
    };

    }
};

然后在 View 中使用一次:

<ul class="projects" data-bind="foreach: projects">
    <li data-bind="text: Description, style: $parent.inMyProjects(ProjectId())">
    </li>
</ul>

抱歉，有点匆忙，所以可能有错字，但你明白了。