组件库：antd 官网：[https://ant.design/docs/react/introduce-cn](https://ant.design/docs/react/introduce-cn) <br/> 我在做表单修改的时候，遇到了一个坑。其中有两个下拉框，选择第一个下拉框的值后才能有第二个下拉框的值。本来这个用antd中的自定义验证就能解决，可是默认值initialValue总是有一个加载不上去。踩坑情景如下： <br> 第一个单选下拉框选择类型：用户/小组，第二个是 [多选下拉框] ，可以选择多个具体的用户或小组。 单选下拉框代码如下： ``` <Form.Item> {getFieldDecorator('type', { initialValue: this.state.detail['type'], rules: [ { required: true, message: '请选择类型!' }, { validator: this.typeValidate.bind(this) } ], })( <Select> <Option value="1">小组</Option> <Option value="0">成员</Option> </Select>, )} </Form.Item>        ``` 多选下拉框的代码如下： ``` {this.state.isGroup? <Form.Item> {getFieldDecorator('group', { initialValue: this.state.detail['group'], rules: [ { required: true, message: '请选择小组!' } ], })( <Select mode="multiple"> { this.state.groupList.map((val, ind) => { return <Option value={val.name} key={val.id}>{val.name}</Option> }) } </Select> )} </Form.Item>   : <Form.Item> {getFieldDecorator('user', { initialValue: this.state.detail['user'], rules: [ { required: true, message: '请选择成员!' } ], })( <Select mode="multiple"> { this.state.userList.map((val, ind) => { return <Option value={val.name} key={val.id}>{val.name}</Option> }) } </Select> )} </Form.Item>   ``` 注意这里我用了一个三目表达式和变量isGroup（判断是小组还是成员）来控制渲染哪个组件，是因为刚开始的时候小组选择是别的组件，小组和用户的表单key值也不一样，只不过后面需求变更所以都改成了多选下拉框，而我也没有再精简，正是因为如此我才踩了这个坑，没想到问题就出在isGroup这个变量。 在业务中，重新选择小组或成员，小组列表或用户列表的值都要重新请求，所以在第一个下拉框中加入的自定义验证的方法typeValidate，代码如下： ``` typeValidate (rule,value,callback) { // 小组 if(value === "1"){ axios.post(url).then((res) => { let groupList = res['data'].data; this.setState({ isGroup: true, groupList, }) callback(); }); } // 成员 if(value === "0"){ axios.post(url).then((res) => { let userList = res['data'].data; this.setState({ isGroup: false, userList, }) callback(); }); } } ``` 注意isGroup的初始值是true，所以每次点修改的时候，我发现小组永远加载不了默认值，而成员可以，当初始值换成false的时候，反过来小组可以成员不可以。我猜测应该是渲染的问题，如果isGroup的值没有变化，则不会渲染上去。于是我对初始值进行了取反，如果修改时初始是小组，则isGroup=false，反之亦然，这样一来就可以解决只加载一个默认值的情况了。 <br> 这里我再说一下另一个坑，自定义验证的时候，回调函数callback一定要有！！！！不然这个验证它会默认没通过，继而出现各种匪夷所思的bug。所以一定要记得加上。