Как получить значения из выпадающего списка Multiple Search Selection в Reaction-Semantic-UI? - PullRequest
Новая
       14

Как получить значения из выпадающего списка Multiple Search Selection в Reaction-Semantic-UI?

2 голосов
/ 09 апреля 2019

Я прошу прощения, если это глупый вопрос, но я не могу понять, как получить значения из выпадающих списков Multiple Search Selection, используя компонент semantic-ui-React.У меня уже есть нужные элементы в нем, и выбор и поиск работают нормально, но я не могу понять, как получить значения из того, что выбрал пользователь.

https://react.semantic -ui.com / modules / dropdown / # types-множественный выбор

спасибо

РЕДАКТИРОВАТЬ:

код: 

import React from 'react'
import { Dropdown } from 'semantic-ui-react'

const wbcOptions = [
    {
        key:1,
        text: 'Normal',
        value: 'Normal'
    },
    {
        key:2,
        text: 'PLT Clumping',
        value: 'PLT Clumping
    },
    {
        key:3,
        text: 'Reactive Lymphocytes',
        value: 'Reactive Lymphocytes'
    },
    {
        key:4,
        text: 'Hypersegmented Neutrophils',
        value: 'Hypersegmented Neutrophils'
    }
]


const DropdownWBC = (props) => (
  <Dropdown
    placeholder='WBC Abnormalities'
    fluid
    multiple
    search
    selection
    options={wbcOptions}
    onChange={props.handleSelectChange} //Is this where I would pass onChange method??
  />
)

export default DropdownWBC

Итак, я создал функцию в моем файле App.js с именем handleSelectChange и передал ее в качестве реквизита этому компоненту (DropdownWBC).Как бы я получить значения из компонента множественного выбора Dropbox Sementic-Reaction и передать его моему компоненту App.js, чтобы я мог установить SetState с его значениями?

1 Ответ

1 голос
/ 09 апреля 2019

Я думаю, это то, что вы пытаетесь сделать. Пожалуйста, проверьте код ниже. 

// By using this "onchange" handler you can access the values selected by the user.
const handleChange = (e, {value}) => {
  console.log(value)
}

const DropdownExampleMultipleSelection = () => (
  <Dropdown placeholder='Skills' onChange={handleChange.bind(this)} fluid multiple 
    selection options={options} />
)
...