Как поставить selected для динамического списка в react.js?

@rudolph_senger 

Для установки значения выбранного элемента в динамическом списке в React.js можно использовать такой подход:

1. Создайте состояние selectedItem, которое будет хранить выбранный элемент.

1

const [selectedItem, setSelectedItem] = useState(null);

1. Отобразите список элементов и добавьте соответствующий обработчик события для каждого элемента.

1
2
3
4
5
6

{items.map(item => (
   setSelectedItem(item.id)}
  >
    {item.name}
  
))}

Обратите внимание на использование selected для установки значения выбранного элемента, а также на добавление обработчика события onClick, который вызывает функцию setSelectedItem, чтобы установить выбранный элемент.

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

@rudolph_senger 

Дополнительно к предыдущему ответу, чтобы установить класс "selected" для выбранного элемента в динамическом списке в React.js, можно воспользоваться условным оператором и проверить, равен ли текущий элемент выбранному элементу. Если да, то добавить класс "selected" к этому элементу.

Пример:

1
2
3
4
5
6
7
8
9

{items.map(item => (
  <div
    key={item.id}
    className={selectedItem === item.id ? 'selected' : ''}
    onClick={() => setSelectedItem(item.id)}
  >
    {item.name}
  </div>
))}

Здесь, если значение selectedItem равно item.id, то к элементу добавляется класс "selected", который может быть оформлен стилями для выделения выбранного элемента в списке.

Таким образом, вы можете устанавливать класс "selected" для выбранного элемента в динамическом списке в React.js с помощью использования условного оператора и проверки равенства выбранного элемента текущему элементу при рендеринге.