Skip to main content

createFilterRule

Description​

Creates a common filtering rule for several input fields

Usage​

createFilterRule(
  fields: {
    id: string,
    [key: string]: any,
  }[],
  type: string,
  value: number | string,
): {
  glue: "or", 
  rules: {
    field: string,
    filter: string,
    value: number | string,
  }[];
} | null

Parameters​

  • fields - (required) an array of field objects. Each object must contain at least the id property, which is the field identifier.
  • type - (required) filter operator, e.g. "equal", "greater", "contains", and others
  • value - (required) the value used for filtering. If this is falsy (e.g., an empty string), the function returns null

Returns​

It returns an object with rules connected with OR logic that can be used for filtering. The object contains:

  • glue - (required) the "or" logic for combining filtering rules
  • rules - (required) an array of filtering rules. Each rule object has the following parameters:
    • field - (required) the id of a field. It is the same as the corresponding field id in the fields parameter.
    • filter - (required) the filter operator
    • value - (required) value for filtering

Example​

This example demonstrates how to use the createFilterRule helpers to convert fields configuration into rules and then use them in the filtering function returned by the createFilter helper

  import { getData } from "../data";
  import { createFilterRule,  createFilter } from "wx-svelte-filter";

  const { fields, data } = getData();
  
  const rules = createFilterRule(fields, "contains", "b");
  const filter = createFilter(rules);
  const filteredData = data.filter(filter);