react中组件的受控

今天去实现一个需求，需要去改公司之前的代码遇到一个莫名奇妙的bug

需求其实很简答 就是后端返回数据将回显到输入框或选择框中，但是使用的是服务端渲染

刚开始的话以为很简单，直接在接口哪里拿到值，然后直接设置state就行
后面本地跑一下，发现就算拿到值后再次提交，也会出发表单验证，且提示用户名与电话为空，这时就去走代码（4年前的了。。。。还是用的类组件读那代码太痛苦了），而且他当时并没有想到业务的扩展性

后续发现，他在去做初始化去请求服务端时，拿到数据后，就去该了对于字段的校验状态，因为只有电话与姓名需要校验，于是便把valid设为了0 其他设为了1 代表着校验未通过状态，于是将 valid: err==null改为了 valid: err==null || lastRegisterFormData,

主要逻辑是，如果后端返回了上次提交的数据，那么我们就信任该返回的数据。如果回显数据用户不去做改变的话是默认校验通过的。

但是后序发现有个字段是记录的时间，但是就只有这一个输入框的数据不能回显，而其他的是显示正常的，

当时第一反应是时间格式的问题，于是去查看他原始的组件是如何封装的，再去控制台查看对应的元素，

输入框的type是h5 的datetime-local，他的格式要求是2023-07-19T15:30:00，但是我后序模拟的数据格式是对的，且切换为其他格式后仍然不能正确回显。于是便怀疑是组件传参的过程出了问题，就去debug。但并没有发现问题，在子组件中正确的接收了父组件传入的filedValue。

这时便去查看组件，直接在初始化获取数据时拿到对应的input，进行dom的属性对比，查看哪里不同

发现了_wrapperState_的不同，其中的controlled属性，设置为了false，表示该组件不受控，且initiaValue的值为空，没有赋值成功，（组件本身出了问题）
于是便去改了原先的代码，单独去设置了时间输入框的defaultValue={fieldValue } 为父组件传入的初始值

这下就没有问题了，不过这个问题很奇怪，因为时间的逻辑并没有去单独的处理，

不得不说，项目大了，屎山代码确实比较多，还不太敢去原有代码上改。