关于antd表单组件遇见的问题

公司在用antd+mobx做表单时遇见一些问题，自己解决并记录下来

业务需求

• 点击新增按钮时，弹出一个嵌入Form的Modal，填写完毕后验证表单
• 点击编辑按钮时，弹出上一个Modal，并将以前的填写信息回显上去
  

遇见的问题

问题1、表单验证后错误信息已经打印到控制台上，但页面中并没有显示错误信息

分析过程：

1. 填写表单时触发onFieldsChange将变化的value存放到store中
2. store状态改变触发mapPropsToFields将store的值回显到页面中

问题原因：
store只保存了表单的value，导致store回显到页面时没有error信息，所以页面中不会显示错误信息。另外form.validateFields也会触发onFieldsChange。

解决方法：
将errors信息也保存到store中（参考issuse）

问题2、store已经改变，但是值没有回显到页面中

当点击编辑按钮时，store中的值并没有回显到表单中,打印store的值发现其实已经存在。

原因：store的值是通过mapPropsToFields回显的，页面没有回显可能就是mapPropsToFields没有触发，在mapPropsToFieldsconsole时，页面没有打印，说明mapPropsToFields没有触发。mapPropsToFields是在组件的componentWillReceiveProps中调用的（关于表单的双向绑定），我们只需要触发组件的componentWillReceiveProps即可。

解决方法：
通过注解mobx的状态已经绑定到了组件的props上了，但是改变mobx有时并不能触发组件的componentWillReceiveProps函数。所以我直接传递一个props。

<CarConfigModal form={{formStore}}/>    

上面传递到CarConfigModal中的props其实并没有实际的作用，我只是为了触发组件的componentWillReceiveProps，让mapPropsToFields触发并回显。