Spin 加载中

用于页面和区块的加载中状态。

何时使用

页面局部处于等待异步数据或正在渲染过程时,合适的加载动效会有效缓解用户的焦虑。

代码演示

绑定数据源

绑定数据源。

Spin加载中 - 图1

  1. import React from 'react';
  2. import ReactDOM from 'react-dom';
  3. import { DataSet, Form, TextField, NumberField, SelectBox, Switch, Button, Spin } from 'choerodon-ui/pro';
  4. const { Option } = SelectBox;
  5. class App extends React.Component {
  6. ds = new DataSet({
  7. primaryKey: 'userid',
  8. name: 'user',
  9. autoQuery: true,
  10. pageSize: 5,
  11. fields: [
  12. {
  13. name: 'userid',
  14. type: 'string',
  15. label: '编号',
  16. required: true,
  17. },
  18. {
  19. name: 'name',
  20. type: 'intl',
  21. label: '姓名',
  22. },
  23. {
  24. name: 'age',
  25. type: 'number',
  26. label: '年龄',
  27. max: 100,
  28. step: 1,
  29. },
  30. {
  31. name: 'sex',
  32. type: 'string',
  33. label: '性别',
  34. lookupCode: 'HR.EMPLOYEE_GENDER',
  35. required: true,
  36. },
  37. { name: 'enable', type: 'boolean', label: '是否开启' },
  38. ],
  39. });
  40. render() {

API

Modal

更多案列和属性请参考 Spin