Javascript 以react HOOK形式设置从api获取的值

我使用的是React钩子表单，所以我关心的是如何设置React钩子表单中的输入字段中的数据，以便发布数据。我的结构是这样的

<form onSubmit={handleSubmit(onSubmit)}>
            <IonItem>
              <IonLabel position="stacked">Full Name</IonLabel>
             

              <Controller
                render={({ onChange, onBlur, value }) => (
                  <IonInput
                   
                    onIonChange={onChange}
                  />
                )}
                control={control}
                name="email"
                defaultValue={state.name}
                value={state.name}
                rules={{
                  required: true,
                  pattern: {
                    value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
                    message: "invalid email address",
                  },
                }}
              />
              {_.get("email.type", errors) === "pattern" && (
                <p className="errorWarning">CHeck email</p>
              )}
            </IonItem>
</form>

全名
(
)}
control={control}
name=“电子邮件”
defaultValue={state.name}
值={state.name}
规则={{
要求：正确，
模式：{
值：/^[A-Z0-9.\%+-]+@[A-Z0-9.-]+\[A-Z]{2,4}$/i，
消息：“无效的电子邮件地址”，
},
}}
/>
{{uu.get（“email.type”，errors）=“pattern”&&(
查看电子邮件

)}

但是，如果我必须使用相同的东西，并将其值设置为从api获得的值，该怎么办

为了检查purposr，我尝试用一些值初始化我的状态，比如

州：{name:'yourname'}

但是，当我尝试使用defaultValue道具和value道具在表单中设置此值时，即使console.log（state.name）给我“yourfullname”，它们都不起作用

 <Controller
                render={({ onChange, onBlur, value }) => (
                  <IonInput
                   
                    onIonChange={onChange}
                  />
                )}
                control={control}
                name="email"
                defaultValue={state.name}
                value={state.name}
                rules={{
                  required: true,
                  pattern: {
                    value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
                    message: "invalid email address",
                  },
                }}
              />

(
)}
control={control}
name=“电子邮件”
defaultValue={state.name}
值={state.name}
规则={{
要求：正确，
模式：{
值：/^[A-Z0-9.\%+-]+@[A-Z0-9.-]+\[A-Z]{2,4}$/i，
消息：“无效的电子邮件地址”，
},
}}
/>

如果您正在使用redux，在将API数据从状态映射到组件中的道具之后

在组件安装时，您需要使用useEffect钩子获取所需的数据，在相同的函数中，检查prop（数据）是否可用，如果可用，则使用setState或类似工具将API数据设置为组件级状态的数据。通过检查道具是否可用以及是否有数据，您可以确保在尝试在表单中使用道具之前返回所需的数据

然后可以将数据从状态传递到表单值或默认值

const[values，setvalues]=useState({
名称：“”
})
useffect（（）=>{
异步函数loadData（）{
等待请求
}
loadData（）
}, [])
useffect（（）=>{
如果（apiData）{
设定值({
名称：apiData.name，
})
}
}，[apiData]）
全名
(
)}
control={control}
name=“电子邮件”
defaultValue={values.name}
value={values.name}
规则={{
要求：正确，
模式：{
值：/^[A-Z0-9.\%+-]+@[A-Z0-9.-]+\[A-Z]{2,4}$/i，
消息：“无效的电子邮件地址”，
},
}}
/>
{{uu.get（“email.type”，errors）=“pattern”&&(
查看电子邮件

)}

你在使用Redux吗？是的，我最终会从我的Redux状态获取所有数据。冷静，等待，我回答。但是为什么我用静态数据手动初始化状态时，我没有显示在输入值中，现在它会显示出来？困惑：）