从Big Json数据快速搜索Vue

Question

我在Vue中有一个Buefy数据表，该表加载通过php文件呈现的json数据。

我一直在寻找快速搜索表中的搜索过滤器，我已经有了：

模板：

<b-field label="Search by Bid Price">
          <b-input v-model="search_query.price"/>
        </b-field>

数据：search_query: { price: "" },

计算函数：

filter: function() {
      if (this.search_query.price) {
        let price_re = new RegExp(this.search_query.price, "i");
        let data = [];
        for (let i in this.posts) {
          if (
            this.posts[i].price &&
            this.posts[i].price.toString().match(price_re)
          ) {
            data.push(this.posts[i]);
          }
        }
        return data;
      }
      return this.posts;
    }

但是根据我的数据来看，这不是很快，而且很慢，它大约有400行，有时更多取决于查询。

Answer 1

所以我所做的是我使用vue-fuse创建了一个不错的且可自定义的搜索设置。但是我遇到了滞后效应，因为我的桌子后面有一个沉重的json来进行搜索，因此我使用了lodash的反跳来修复它。现在它就像一种魅力。