将 core-ui disabled 属性条件添加到表单组件内的 fieldset 标记

Question

我正在使用 react spring-boot 代码库，它使用 core-ui 作为前端，如果正在使用表单，我需要禁用所有表单字段。我在后端 table 添加了一个 isLocked 属性，并且可以在我需要禁用字段的页面上获取值。我尝试了几种方法，但 none 似乎有效。

我试过了

<fieldset {isDisabled} >

但是报错解析错误：意外标记，应为“...”

<fieldset {data.isLocked ? 'disabled' : null} >

但也会抛出类似的错误

我必须使用

<fieldset disabled >

因为 core-ui 禁用字段集无法以任何其他方式工作，请参阅 link https://coreui.io/docs/components/forms/#disabled-forms

如果大家有什么建议请指教

我试过这样但出现错误

{ data.isLocked && <fieldset disabled  >}

  Line 2320:  Parsing error: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>?

  2318 |                               </Content>
  2319 |                               </fieldset>
> 2320 |                           </Form>
       |                           ^
  2321 |                       </div>

Answer 1

不确定您真正使用什么来确定禁用部分，但根据您的问题，您需要使用：

使用 isDisabled 值，您将执行如下操作：

<fieldset disabled={isDisabled === "disabled" ? true : false} >

或者，使用 data.isLocked

<Form>
  <fieldset disabled={data.isLocked ? true : false} >
    ...
  </fieldset>
</Form>

将 core-ui disabled 属性条件添加到表单组件内的 fieldset 标记

Adding core-ui disabled attribute conditional to fieldset tag inside form component

jsx

reactjs

core-ui