ReactJS: Возможно ли динамически изменить мой атрибут «цель-данные»?а не индивидуально их настраивать?

Question

По сути, я создаю загрузочную таблицу в своем реактивном проекте и использую переключатель аккордеона, чтобы содержать избыточную информацию в раскрывающемся списке.На данный момент, когда я щелкаю раскрывающийся список, открываются все раскрывающиеся списки, поэтому я пытаюсь установить атрибут data-target (в настоящее время установлен на #demo1) и атрибут id для динамического изменения, чтобы дать мне лучший контроль над тем, какиераскрывающийся список открыт, и когда.

Я использую React и начальную загрузку, и я все еще довольно нов: S

Я попытался установить для data-target уникальный идентификатор {item._id}, который совпадает св качестве ключа, но ничего не происходит, я предполагаю, что это потому, что у меня нет # перед ним, но будет ошибка, если я добавлю его в начало выражения.

<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>

Answer 1

Я бы, вероятно, сделал бы это, отслеживая состояние всех выпадающих (открытых или закрытых) в родительском компоненте в массиве и передавая его дочернему компоненту в виде логического свойства, такого как isOpen.

Если есть что-то еще, возможно, вы можете прикрепить скриншот того, что вы пытаетесь сделать?