【raETable】🎉🎉🎉大更新！大更新！绝对大更新！

🎉好消息，raETable迎来第三个版本了！

本次更新主要有三个，次要更新有一个：

1. 🚀支持更多内置组件
2. 🚀支持注册自定义组件
3. 🚀全局支持响应式布局
4. ✈书写习惯改进

raETable是一款面向toB的快捷组件库，名字是react antd Easy Table 的缩写。旨在让开发者在react中使用 antd的Table时更 easy。

文档地址：mmdctjj.github.io/raetable/

githup地址：github.com/mmdctjj/rae…

🚀支持更多的内置组件

本次更新，内置的组件数量已经达到了15个，它们如下图所示

❓如何给组件传参

你只需要将需要的参数在column(EFormItemProps类型)声明即可。

    {
      dataIndex: 'name',
      title: '姓名',
      key: 'name',
      affairType: 'InputNumber',
      controls: false,
      prefix: 'yourName length'
    },

🚀支持注册自定义组件

使用自定义组件时需要使用官方提供的注册函数useExtendFormItem，它的参数是一个对象{[key: string]: (props: EFormItemProps) => ReactNode}，该value是你自己定义的组件，它会接受EFormItemProps组件参数供你使用。

useExtendFormItem({
  yourComponentName1: ({ type, value, onChange }) => {
    if (type === 'display') return <>{value}</>;
    return <Input value={value + '自定义的组件Input1'} onChange={onChange} />;
  },
  yourComponentName2: ({ type, value, onChange }) => {
    if (type === 'display') return <>{value}</>;
    return <Input value={value + '自定义的组件Input2'} onChange={onChange} />;
  },
});

接着你就可以在columns里申明这个组件了

<EPage
  columns={[
    ...,
    {
      dataIndex: 'name',
      title: '姓名',
      key: 'name',
      conditionType: 'yourComponentName1',
      affairType: 'yourComponentName2'
    },
    ...
  ]}
/>

你可以在多个地方的调用useExtendFormItem注册组件，

如果组件名称重复，会覆盖旧的组件，所以你也可以用此方法重写默认组件

🚀全局支持响应式布局

目前全局的响应式布局遵循了Bootstrap的响应式布局

针对小屏幕的设备，对table做了优化

✈书写习惯改进

改进的地方如下：

1. raETable特别export了FORMTYPE枚举类型供开发者快速声明组件名称
2. 每个组件名称使用了antd的命名习惯，组件名称首字母都大写

所以现在声明组件也可以这样写:

import { FORMTYPE } from 'raetable'
 {
    dataIndex: 'input',
    key: 'input',
    title: 'input',
    affairType: FORMTYPE.Input
    // 等价于=> affairType: 'Input',
  },
  {
    dataIndex: 'number',
    key: 'number',
    title: 'number',
    affairType: 'InputNumber'
    // 等价于=> affairType: 'InputNumber',
  },

我们的库是基于antd的，所以这里保持了一样的习惯。开发者在自定义组件时，可以保持这个习惯（非必须的）

本次的更新就这些了，希望大家多多支持，友善交流