将 React Form 表单的库存数量输入改为复选框
您可以将库存数量的输入方式更改为复选框,并根据复选框是否选中来判断库存数量是否为0。以下是修改后的代码示例:
export const searchFormSchema: FormSchema[] = [
{
label: '库存数量',
field: 'Quantity',
component: 'Checkbox',
defaultValue: false,
componentProps: {
checkedValue: 0, // 复选框选中时的值
uncheckedValue: null, // 复选框未选中时的值
},
required: true, // 是否必填
ifShow: ({ values }) => values.Quantity !== null, // 当复选框未选中时隐藏输入框
},
{
field: 'QuantityInput',
component: 'Input',
defaultValue: 0,
show: ({ values }) => values.Quantity !== null, // 当复选框选中时显示输入框
},
];
在上面的代码中,我们将库存数量的组件类型由Input改为Checkbox,并根据复选框选中与否来设置Quantity字段的值。同时,我们添加了一个名为QuantityInput的额外字段,用于显示输入框。根据复选框的选中状态,我们使用ifShow和show属性来控制显示和隐藏输入框。
请注意,上述代码是基于 TypeScript 的示例,如果您的项目不使用 TypeScript,则需要将类型声明去除。
原文地址: https://www.cveoy.top/t/topic/qr4T 著作权归作者所有。请勿转载和采集!