问题描述
我使用的是名为Formik(2.1.5)的最新版本的Reaction表单库。
它相当不错,但我在初始加载时遇到了单选按钮组的问题。
当我第一次加载表单时,我设置了一组初始值。
当我执行console.log并且所有数据都在那里时,我可以看到它们。
我的输入域和文本域完美地加载了初始值。
但是我的单选按钮组没有显示应该选择哪个单选按钮。
以下是我的单选按钮组代码:
<label htmlFor="radioGroup" style={{ display: "block" }}>
Character Race
</label>
<label>
<Field type="radio" name="charRace" value="1" />
Human
</label>
<label>
<Field type="radio" name="charRace" value="2" />
Elf
</label>
<label>
<Field type="radio" name="charRace" value="3" />
Dwarf
</label>
加载表单时,以下是初始值:
<Formik
initialValues={{
charId: id,
charName: name,
charClass: class,
charRace: race
charAge: age,
charRegion: region
}}
现在,当表单加载时,charID、charName、charClass、charAge和charRegion的字段都已正确填写。
当我对值执行console.log时,我会看到它们全部...例如:
charId: 3728,
charName: Jeriod,
charClass: Wizard,
charRace: 1,
charAge: 34,
charRegion: North
但我想不出如何让charRace单选按钮组选中正确的单选按钮。它们始终处于未选中状态。
如有任何帮助,我们将不胜感激!
推荐答案
charRace
初始值必须是字符串。您可以在此处测试
https://codesandbox.io/s/trusting-hofstadter-hihhj
<Formik
initialValues={{
charId: id,
charName: name,
charClass: class,
charRace: String(race),
charAge: age,
charRegion: region
}}