Каков наилучший способ получить выбранное значение из компонента React-Select? - PullRequest
Новая
       48

Каков наилучший способ получить выбранное значение из компонента React-Select?

3 голосов
/ 25 февраля 2020

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

import Select from 'react-select'


let options = [
 {
 label: Small,
 change: -3
 },
 {
 label: Medium,
 change: 0
 }
]

<Select id={"options"} defaultValue={options[0]} options={options} />

let selectedChange = // How can I access the change property?
let selectedLabel = document.querySelector(`#options`).textContent // This is how I have been getting the proper label

<button onClick={console.log(selectedChange, selectedLabel)}></button>

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

1 Ответ

0 голосов
/ 25 марта 2020

Подсказка React-Select onChange принимает метод и получает как выбранный элемент (ы), так и выполняемое действие: 

function(
  One of<
    Object,
    Array<Object>,
    null,
    undefined
  >,
  {
    action required One of<
      "select-option",
      "deselect-option",
      "remove-value",
      "pop-value",
      "set-value",
      "clear",
      "create-option"
    >
  }
  ) => undefined

Вам решать, как разработчик, чтобы выбрать, что делать с объектами, возвращенными из этого метода. Например, вы можете проверить это Codesandbox .

...