基本上，我在react项目中创建了一个引导表，并使用一个可折叠的切换来包含下拉列表中的多余信息。到目前为止，当我单击“打开所有下拉列表”时，我尝试将data-target属性（当前设置为#demo1）和id属性设置为动态更改，以便更好地控制哪个下拉列表打开以及何时打开。
我正在使用React和bootstrap，而且还是相当新的：S
我尝试将data-target设置为一个唯一的ID {item._id}，它与key相同，但没有发生任何事情，我认为这是因为我没有在它前面加上#，但如果我将它添加到表达式的前面，它会出错。
<tr
key={item._id}
className="accordion-toggle"
data-toggle="collapse"
data-target="#demo1"
>
{...}
</tr>
<tr>
<td colSpan="6" className="hiddenRow">
<div className="accordion-body collapse" id="demo1">
<table className="table table-dark">
</table>
</div>
</td>
</tr>
2条答案
按热度按时间pu82cl6c1#
我可能会通过在数组中跟踪父组件中所有Dropdown的状态（打开vs关闭），并将其作为布尔属性（如'isOpen'）传递给子组件来做到这一点。
如果有更多的，也许你可以附上一个截图，你正在尝试做什么？
kxeu7u2r2#
可能不适用于旧版本的react/bootstrap，但使用bootstrap 5和react 18（可能降至16），您可以将属性 Package 在花括号中并连接所需的id，例如。{"#demo”+ idx}。