在backbone.js框架中使用Visualsearch.js

Using Visualsearch.js in a backbone.js framework

本文关键字：js Visualsearch 框架 backbone      更新时间：2023-09-26

首先，感谢DocumentCloud发布了这两个超级有用的工具。

我的问题是:

我试图在一个backbone.js应用程序中使用visulassearch .js。

在我的应用程序中，我有一个基本的index.html和一个myapp.js javascript文件，其中包含主应用程序与backbone.js完成

我使用CouchDB作为数据存储，并且我可以成功地以restful方式检索要放在集合中的所有数据。
我必须检索由visualsearch.js给出的搜索查询，并使用它来过滤集合。
我当然需要一个搜索框的视图，当输入时触发一个事件，但是…

  1. 我应该初始化搜索框外部到myapp.js，在一个额外的js文件或我的index.html页面(在visualsearch迷你教程中建议)?还是应该在搜索框视图(myapp.js)中初始化?后一种解决方案似乎太棘手了(这是我试图做的，但即使我成功了，它也太复杂了，我失去了骨干mvc的简单性)。

  2. 假设我成功地将搜索字符串检索为JSON对象，如{name:'Fat DAvid', address:'24, slim st', phone:'0098876534287'}。这样做之后，我可以使用哪个函数来检索集合中字段与给定字符串匹配的模型。我知道我应该做一个映射或过滤器，但这些功能似乎是为略微不同的任务服务的。

    。这真的是过滤结果的最好方法吗?它向客户端收费(客户端必须过滤结果)，而对CouchDB进行新的查询(视图或过滤器)将非常简单，考虑到数据量小，对站点的访问速率低，成本也不高。然而，在客户端进行所有过滤操作，比在CouchDB中创建新视图(或列表或过滤器)并将其链接到backbone.js视图

    要简单得多。

你可以在myapp.js中初始化VisualSearch.js搜索框。只要确保您保留了对它的引用，以便稍后可以提取出facet和值。

例如:

var visualSearch = VS.init({...})
// Returns the unstructured search query
visualSearch.searchBox.value() 
// "country: "South Africa" account: 5-samuel title: "Pentagon Papers""
// Returns an array of Facet model instances
visualSearch.searchQuery.facets()
// [FacetModel<country:"South Africa">, 
//  FacetModel<account:5-samuel>, 
//  FacetModel<title:"Pentagon Papers">]

如果您在Backbone集合中有这些模型，您可以轻松地执行过滤器:

var facets = visualSearch.searchQuery.models;
_.each(facets, function(facet) {
    switch (facet.get('category')) {
        case 'country':
            CountriesCollection.select(function(country) { 
                return country.get('name') == facet.get('value'); 
            });
        break;
        // etc...
    }
});
相关文章：