如何将值传递给 react-bootstrap 中复选框组件中的 for( htmlFor ) 属性？答案

【问题标题】：How to pass a value to for( htmlFor ) attribute in checkbox component in react-bootstrap?如何将值传递给 react-bootstrap 中复选框组件中的 for( htmlFor ) 属性？
【发布时间】：2018-07-23 12:53:09
【问题描述】：

我在一个项目中维护 WCAG2.0 'AA' 标准，我需要在 react-bootstrap 的复选框组件中为 for 属性提供一个值，但可以找不到合适的解决方案。

代码:: 我在写什么 jsx

<Checkbox checked={ props.item.selected || false }
onChange={() => {}}>
    <div className="label-text"></div>
</Checkbox>

我在 html 中的样子：

<div class="checkbox">
    <label title="">
        <input type="checkbox" value="on">
        <div class="label-text"></div>
    </label>
</div>

寻找某种 html ：

<label **for="boxa"**>birds</label>
<input **id="boxa"** type="checkbox" name="mytext" />

【问题讨论】：

对你的代码的理解不是很清楚。请添加更多详细信息，我认为您正在寻找这样的东西：stackoverflow.com/a/46956250/7528968

标签： html reactjs react-bootstrap wcag2.0

【解决方案1】：

您可以从react-bootstrap 查看组件的源代码，但是TLDR：他们不提供选项来添加for Checkbox 组件上的属性。甚至还有一个 eslint disable for 它。

这是复选框附带的标签的source。

【讨论】：