VisActor VBI
  • 简体中文

      • FilterPanel

      导入

      import { FilterPanel } from '@visactor/vbi-react/components'

      签名

      FilterPanel(props: FilterPanelProps)

      说明

      提供 Where / Having 过滤条件的新增、编辑、删除与分组展示能力。

      推荐先看

      Live Demo

      FilterPanel Demo
      Where filters
      • No where filters
      Having filters
      • No having filters
      {
  "uuid": "dd29c0d3-ab89-429a-afa9-8c2ee58baeaa",
  "connectorId": "vbiReactStarterApiDemoConnector",
  "chartType": "table",
  "theme": "light",
  "locale": "zh-CN",
  "version": 0,
  "whereFilter": {
    "id": "root",
    "op": "and",
    "conditions": []
  },
  "havingFilter": {
    "id": "root",
    "op": "and",
    "conditions": []
  },
  "measures": [],
  "dimensions": []
}

      最小示例

      import type { VBIChartBuilder } from '@visactor/vbi'
import { FilterPanel } from '@visactor/vbi-react/components'

export function Demo({ builder }: { builder: VBIChartBuilder }) {
  return <FilterPanel builder={builder} />
}