Question

不是通过搜索输入computedPageLinks事件进行keyup更新，任何人都可以帮助我修改上述小提示，以便通过按钮computedPageLinks更新click更新并且不会＃ 39;当搜索输入失去焦点时t更新？

Answer 1

由于您的搜索结果基于query更改的值，即使您删除了valueUpdate: 'keyup'设置，当输入框模糊时，该计算函数仍会更新。

你可以通过移动＆＃34;搜索＆＃34;来打破这种行为。超出计算的可观察量，而是填充＆＃34;结果＆＃34;单击发生时的可观察数组。

所以，添加一个＆＃34;结果＆＃34;阵列：

self.results = ko.observableArray([]);

然后添加一个搜索功能，我们可以在点击时触发填充结果：

self.search = function() {
    // Did the user search for anything?
    if (!self.query()) {
        self.results([]);
        return;
    }
    // Do the "search"
    self.results(ko.utils.arrayFilter(self.pageLinks(), function(item) {
        return item.title.toLowerCase().indexOf(self.query().toLowerCase()) >= 0;
    }) || []);
};

现在您可以删除计算的observable，并更改绑定以使用results数组：

<tbody data-bind="foreach: results">

要将其全部链接起来，请先删除valueUpdate上的<input>设置，然后添加<button>来触发模型上的search功能：

<input placeholder="Search…" type="search" name="q" data-bind="value: query" autocomplete="off" /> 
<button type="button" data-bind="click: search">Go</button>

Demo

使用单击事件操作替换keyup事件操作

1 个答案: