Antd V4 表单列表的 setFieldValue 方法用于设置表单列表中某个字段的值。以下是一个示例解决方法:
首先,确保你已经正确引入了 Antd V4 的相关组件和依赖。
然后,在你的代码中创建一个表单列表的状态数组,例如:
const [list, setList] = useState([
{ id: 1, name: '张三' },
{ id: 2, name: '李四' },
{ id: 3, name: '王五' },
]);
接下来,创建一个函数用于设置表单列表中某个字段的值,例如:
const setItemValue = (id, fieldName, value) => {
const newList = list.map(item => {
if (item.id === id) {
return { ...item, [fieldName]: value };
}
return item;
});
setList(newList);
};
在表单列表的渲染部分,使用 setFieldValue 方法来设置字段的值,例如:
{(fields, { add, remove }) => (
<>
{fields.map((field, index) => (
setItemValue(list[index].id, 'name', e.target.value)}
/>
))}
>
)}
在这个示例中,我们通过 setFieldValue
方法将输入框的值绑定到了表单列表中的 name
字段,并通过 setItemValue
函数来更新表单列表中的值。
希望以上解决方法能够帮助到你!
上一篇:antd v4 - 步骤和表单