@beisen-platform/ux-standard-search NPM

SearchForm

1 介绍

该组件用于筛选，内置了元数据解析功能

2 API

2.1 props 列表

注意！元数据是以解构方式传递的

name	type	default	description
biz_data	object	none	搜索结果的默认值，只在初始化时生效
isInPopUp	boolean	false	是否被放在弹层中，筛选弹层的 z-index 会自动增加
containerZIndex	number	none	外部容器的层级，若有值，筛选弹层的 z-index 会以此为基础
extendedFieldMapByFieldName	Function	none	根据字段名扩展组件
onSearch	Function	none	搜索结果改变后的回调

2.2 元数据

const metadata = {
  cmp_id: 'feabf9d6-ca5c-4201-8e6e-f1cc1bad88db',
  cmp_name: 'BeisenCloudDemo_sousousou',
  cmp_type: 'SearchForm',
  version: '20181219142750122',
  form_parts: null,
  common_fields: null,
  cmp_data: {},
  sub_cmps: []
};

return <SearchForm {...metadata} />;

2.3 onSearch

const handleSearch = (searchData, isSearch, customview_biz_data) => {
  // searchData是搜索结果
  // isSearch这里写死为true
  // customview_biz_data是回传了this.props.customview_biz_data
  // ......
};

return <SearchForm onSearch={handleSearch} />;

2.4 extendedFieldMapByFieldName

const extendedFieldMapByFieldName = {
  // field_name: 字段元数据中cmp_data.field_name
  [field_name]: (props, OriginFieldComponent) => {
    // OriginFieldComponent是当前字段对应的默认组件
    // 可以根据自己的需求，自定义数据和组件
    return <MyCustomComponent {...myCustomProps} >;
  }
};

return <SearchForm extendedFieldMapByFieldName={extendedFieldMapByFieldName} />;