Как я могу преобразовать стандартный тег «select» в реагировать на выбор

Question

Я хочу превратить это в ответ от выбора.Все данные, которые передаются, отлично работают, но когда я их заменяю, они не работают (потому что для этого нужны другие параметры), мне было интересно, как сделать этот фрагмент кода совместимым с React-Select.

<div>
   <select value={this.state.currency} onChange={this.getTest}>
      {this.state.items.map((obj, index) => 
         <option key={${index}-${obj.country}} value={obj}> {obj} </option>
      )} 
   </select>
</div>

Answer 1

Хороший пример из библиотеки

import React from 'react';
import Select from 'react-select';

const options = [
  { value: 'chocolate', label: 'Chocolate' },
  { value: 'strawberry', label: 'Strawberry' },
  { value: 'vanilla', label: 'Vanilla' }
];

class App extends React.Component {
  state = {
    selectedOption: null,
  }
  handleChange = (selectedOption) => {
    this.setState({ selectedOption });
    console.log(`Option selected:`, selectedOption);
  }
  render() {
    const { selectedOption } = this.state;

    return (
      <Select
        value={selectedOption}
        onChange={this.handleChange}
        options={options}
      />
    );
  }
}

Answer 2

Нет необходимости указывать «значение» для выбранного элемента. Скорее вам нужно соответственно установить свое состояние в функции onChange.

Если это было сделано для того, чтобы каким-то образом «связать» опцию выбора и состояние, вы, вероятно, не пойдете по пути реакции (вероятно, из-за углового фона, где такие двусторонние привязки являются подходящим способом).