defaultValue是React中用于设置表单元素的默认值的属性。但是在CheckboxGroupInput组件上,defaultValue属性无法正常工作。
CheckboxGroupInput是一个用于展示多个复选框的组件,它可以让用户从多个选项中选择一个或多个选项。在CheckboxGroupInput中,我们可以通过value属性来设置选中的选项,而不是使用defaultValue属性。
以下是一个示例代码,展示了如何在CheckboxGroupInput中设置选中的选项:
import { CheckboxGroupInput } from 'react-admin';
const options = [
{ id: '1', name: 'Option 1' },
{ id: '2', name: 'Option 2' },
{ id: '3', name: 'Option 3' },
];
const MyForm = () => {
const [selectedOptions, setSelectedOptions] = useState([]);
const handleOptionsChange = (value) => {
setSelectedOptions(value);
};
return (
<CheckboxGroupInput
source="options"
choices={options}
value={selectedOptions}
onChange={handleOptionsChange}
/>
);
};
export default MyForm;
在上述代码中,我们使用useState来定义一个selectedOptions状态,用于保存选中的选项。然后,通过onChange事件处理函数handleOptionsChange来更新selectedOptions状态。最后,将selectedOptions作为value属性传递给CheckboxGroupInput组件。
这样,当用户选择或取消选择复选框时,selectedOptions状态会相应地更新,从而实现了在CheckboxGroupInput中设置选中的选项。
腾讯云提供了一系列与云计算相关的产品,例如云服务器、云数据库、云存储等。您可以根据具体需求选择适合的产品。更多关于腾讯云产品的信息,请访问腾讯云官方网站:腾讯云。
领取专属 10元无门槛券
手把手带您无忧上云