React-jsonschema-form：如何在UI Schema中实现条件禁用输入框？

直接靠 uiSchema 本身的静态配置没法实现这种动态条件逻辑——uiSchema 主要负责 UI 的静态样式、组件映射、提示文本这类固定配置，本身不支持内嵌条件判断。不过你可以利用 uiSchema 里支持动态计算的属性来实现这个需求，具体写法如下：

你的 schema 保持不变：

const schema = {
  type: 'object',
  properties: {
    name: { type: 'string' },
    disableInput: { type: 'boolean' },
  },
};

然后在 uiSchema 里给 name 字段配置 ui:disabled 属性，传入一个依赖 formData 的函数：

const uiSchema = {
  name: {
    'ui:disabled': (formData) => formData?.disableInput === true
  }
};

原理很简单：ui:disabled 支持接收函数作为值，函数会拿到当前表单的 formData。当勾选 disableInput 复选框时，formData 里的该字段会变成 true，函数返回 true 就会触发输入框禁用；取消勾选时返回 false，输入框恢复可用。

如果是更复杂的交互逻辑，可能需要自定义组件或者监听表单 onChange 事件手动处理，但针对你这个需求，上面的写法已经完全够用。

内容的提问来源于stack exchange，提问作者Mortal Wombat