syncfusion - 同步融合查询构建器没有返回数据

Question

我有一个数据集，我想为它构建一个查询工具，所以我不是一名网络开发人员，所以我求助于 Syncfusion 的QueryBuilder.

使用他们的本地数据教程中显示的确切代码App.vue和datasource.js. 我做了我的网页，当输入条件时没有数据返回给我。查询时如何获取要返回的数据？

Answer 1

我们已检查您报告的查询。我们使用本地数据准备了 Querybuilder 示例，如下面的代码片段所示。

App.vue

<template>
  <div class="control-section">
    <div class="col-lg-12 querybuilder-control">
      <ejs-querybuilder
        width="70%"
        :rule="importRules"
        :dataSource="dataSource"
      >
      </ejs-querybuilder>
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import {
  QueryBuilderPlugin,
  dataSource,
} from "@syncfusion/ej2-vue-querybuilder";
Vue.use(QueryBuilderPlugin);
import { employeeData } from "/src/dataSource.js";

export default {
  data: function () {
    return {
      dataSource: employeeData,
      values: ["Mr.", "Mrs."],
      importRules: {
        condition: "and",
        rules: [
          {
            label: "Employee ID",
            field: "EmployeeID",
            type: "number",
            operator: "equal",
            value: 1,
          },
          {
            label: "Title",
            field: "Title",
            type: "string",
            operator: "equal",
            value: "Sales Manager",
          },
        ],
      },
    };
  },
};
</script>

供您参考，我们已根据您的要求准备了样品。请检查以下示例。

示例：https ://codesandbox.io/s/vue-template-forked-g62vv?file=/src/App.vue