如何动态更新复选框的react-json-schema表单
如何动态更新复选框的react-json-schema表单
提问于 2020-03-07 22:35:47
我有类似下面这样的代码
const Jschema = {
"type": "object",
"title": "Create Form",
"required": [
"level1",
"level2"
],
"properties": {
"level1": {
"type": "string",
"title": "Level 1",
"default": ""
},
"level2": {
"type": "array",
"items": {
"enum": [
"no position"
],
"type": "string"
},
"title": "Level 2",
"uniqueItems": true
},
},
"description": "Create Form"
}
const uiSchema = {
"ui:order": [
"level1",
"level2"
],
"level1": {
"ui:title": "Rank Level 1",
"ui:widget": "dropdown",
"ui:placeholder": "Please select rank level 1"
},
"level2": {
"ui:title": "Rank Level 2",
"ui:widget": "checkboxes",
"ui:placeholder": "Please select rank level 2"
}
}
const dropDownList = {
level1: {
url: '/v2/level1_rank',
name: 'level1',
accessorName: 'level1_name',
accessorValue: 'level1_value'
}
}然后将在以下时间生成
render((
<Form schema={schema}
uiSchema={uiSchema}
formData={formData} />
), document.getElementById("app"));然后我有这样的一些逻辑，首席财务官(首席财务官，首席财务官，首席信息官和首席技术官)的level2 (复选框)将更改为(会计经理，财务经理，欺诈经理)，如果我们选择首席技术官level2将更改为(IT经理，基础设施经理等)的董事会位置(首席财务官，首席财务官和首席技术官)。假设我有后端，并且后端是按照状态生成的。我只需要获取状态，并且需要更新level2上的"items:“复选框。
所以我的问题是如何动态地更改level2上的“项目：”在我的案例中，当我选择level1时，我想选择首席财务官，level2复选框将显示首席财务官部门的三个职位(会计经理、财务经理、欺诈经理等)，然后我只选择会计经理和欺诈经理。
谢谢
回答 1
Stack Overflow用户
发布于 2020-03-07 23:17:20
个人输入
为了实现这种条件场效果，通常可以通过单独的输入来实现。
<Input name="input1" value={value1} onChange={onChange1} />
<Input name="input2" value={value2} onChange={onChange2} />假设两个输入都是通过value和onChange控制的，那么您可以使用自己的逻辑进行连接，如下所示
const onChange1 = e => {
if (e.target.value === '1') {
value2 = '2'
}
}表单处理
以上是假设你拥有个人控制权的情况。但是如果你有一个Form或useForm，如果你能访问表单values和setValues，你仍然可以实现它。
useEffect(() => {
if (values.input1 === 1) {
setValues({ input2: 2 })
}
}, [values])页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60578614
复制相关文章
相似问题
腾讯云开发者
