技术创作与交流平台

在 Select 选择框中，如果数据是动态生成的，需要先设置下拉框中的选项，然后再设置对应的 value 值，否则会出现 value 值无法正确显示对应 label 的情况。
在 Form 表单中，可以使用 display: none 来隐藏表单项。这样做的好处是可以确保字段都被注册，从而方便地使用 form.setFieldsValue() 方法来设置表单的值。如果表单项是根据条件动态渲染的，在某些条件下渲染，某些条件下不渲染，直接使用 form.setFieldsValue 可能会导致一些问题。
```
<Form style={{ display: 'none' }}>
    {
        getFieldDecorator('ruleName', {
            initialValue: undefined,
            rules: [],
        })(<Input />)
    }
</Form>
```
在 Ant Design 的 Form 表单提交时，如果某个字段的值是 undefined，该字段不会被提交到后台。
在 Ant Design 3.x 版本中，通过 getFieldDecorator 注册字段，当这些字段是动态生成且可以动态增删时，页面上显示的字段与通过 getFieldValue 获取的字段可能会不一致。因此，建议使用高版本的 Ant Design Form 组件，如 Ant Design 4.x。
在 Ant Design 3.x 中，通过 Form 表单 API 管理数据，例如通过 form.getFieldValue/form.getFieldsValue 来获取数据，有时比直接使用 useState 定义的 state 更方便。这是因为模板中调用确实如此，但在函数内部调用 getFieldValue 时，需要注意调用的时机，可能通过 getFieldValue 获取到的不是最新的值。
```
return (
    form.getFieldValue('type') === 1 ? <div>欢迎您！</div> : null
)
```
在 Ant Design 的 Tabs 组件中，TabPane 子组件如果不设置 forceRender 为 true，则只会渲染激活的 Tab 栏目，其他 Tab 栏目则不会渲染。如果设置了 forceRender 为 true，则会渲染所有 Tab 栏目，但只有激活的 Tab 栏目的 display 属性不为 false。
Ant Design 的 Form 表单也是一种数据存储方案，有时候比直接使用 useState 更方便，特别是在直接应用于模板中时。在 Ant Design 3.x 中，使用 form.getFieldValue 方法之前，需要先使用 getFieldDecorator 方法来修饰注册字段。

关于使用Antd 组件库的一些总结