UNPKG

@linkdesign/screen

Version:

屏组件库,但使用场景又不局限于屏。主要用于BI、大盘和屏

106 lines (81 loc) 2.52 kB
# 请求 Query - 请求函数 - 请求参数 - 请求频率 - 过滤器 - 完成/失败回调 ## 使用场景 - 数据请求 ## 演示 <!--before-content--> ## 基础用法 ```js import { Text, Other } from '@linkdesign/screen'; import axios from 'axios'; const { Indicator } = Text; const { Query } = Other; const query = { service: (vars) => axios({ method: 'POST', url: '//101.132.153.153/park/data/common/query', data: vars, }), variables: { "path": "/park/changde/statistics", "pageSize": 5, "pageNum": 1, "params": [{ "fieldName": "county", "operator": "=", "value": null, }], }, }; const filter = () => { return [{ label: '停车1', value: 1, unit: '个', }, { label: '停车2', value: 2, unit: '万', }, { label: '停车3', value: 3, unit: '%', }]; // return get(data, 'data.data.items.[0]', []); }; class App extends React.Component { render() { return ( <Query component="div" className="card card1" query={query.service} variables={query.variables} filters={[filter]} > <Indicator /> <Indicator /> <Indicator /> </Query> ); } } ReactDOM.render(<App />); ``` <!--after-content--> ### API | 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 | | --------------------------------- | ------------ | ---- | --------------------------------------- | ---------------------------------------------------- | ------------ | | query | 请求函数 | Y | Function: (variables: object) => Promise<object>; | - | 返回一个promise对象 | | variables | 指标类型 | N | Object | - | | | interval | 请求频率 | N | Number | - | | | filters | 过滤器 | N | Function[] | - | | | component | 包裹子元素的标签 | N | String | - | | | onCompleted | 请求完成的回调 | N | Function | - | | | onError | 请求错误时的回调 | N | Function | - | | ## TODO List - [ ] ...