React-Select запускает выбор опции - PullRequest
Новая
       12

React-Select запускает выбор опции

0 голосов
/ 25 сентября 2019

У меня есть компонент реагирования с элементом <Select options={myoptions} onChange={this.mychangehandler}/> из реагирования-выбора.Я сохранил некоторые настройки с использованием приставки, к которой можно получить доступ, например, используя this.props.myreducer.dropdownvalue (уже проверено, значения доступны при первом рендеринге компонента)

В зависимости от реквизита прижима, я хочу автоматически выбрать один из вариантовв раскрывающемся списке.Как я могу указать в раскрывающемся списке <Select.../> автоматический выбор опции 2, если this.props.myreducer.dropdownvalue равен 1?

Существует бесчисленное множество свойств, но почему-то я не нашел никого, кто мог бы помочь мне автоматически выбрать правильную запись.

Есть идеи?Решения, которые автоматически запускают onChange, также предпочтительнее, но в противном случае проблем не должно быть.

Заранее спасибо:)

С уважением, Кристиан

edit: Вот полный код: 

import React, {Component} from 'react';
import { connect } from 'react-redux';
import Auxiliary from '../../../../../../../hoc/Auxiliary/Auxiliary';
import classes from './Dropdown.module.css';
import Select from 'react-select';

class Dropdown extends Component {

changeSetting = (event) => {
    console.log('qid'+this.props.qid)
    console.log('event: '+JSON.stringify(event))
    if(this.props.certs.certquestions[this.props.qid].red === event.id)
    {
        this.props.colorchanger("red")
    }else if(this.props.certs.certquestions[this.props.qid].yellow === event.id)
    {
        this.props.colorchanger("yellow")
    }else if(this.props.certs.certquestions[this.props.qid].green === event.id)
    {
        this.props.colorchanger("green")
    }
}
render(){
    const options = []
    const qid = this.props.qid
    console.log('qid:'+qid)
    const question = this.props.certs.certquestions[qid]
    const opt = question.options.split("|")
    for(let i = 0;i<opt.length;i++){
        let optname = opt[i]
        options.push({value:i, label:optname, id:i})
    }
    let notes = "";
    let selectedOption = null;
    if(this.props.loadp)
    {
        let progress = this.props.certs.loadedProgress[this.props.users.users[this.props.users.currentuser].target_id+'_'+this.props.q]
        if (typeof progress !== 'undefined')
        {
            notes = progress.notes
            selectedOption = progress.selectedOption
        }
    }
return(
    <Auxiliary>
        <h3>{question.title}</h3>
    <Select className = {classes.Dropdown} options={options} onChange={this.changeSetting}/ value={selectedOption}> //selectedOption is an Integer
    <textarea value = {notes}/>
</Auxiliary>
)
}
}
const mapStateToProps = state => {
return {
    certs: state.certs,
    users: state.users
};
}
export default connect(mapStateToProps, null)(Dropdown);

параметры имеют разные метки и значение и идентификатор от 0 до 9. Я пытался добавить value={selectedOption} к элементу Select, также пробовал его с меткой, но он всегда показывает только"Выберите ..." местозаполнитель и не выбирает опцию и не вызывает onChange.Любая идея, что я делаю не так?

Решено: Теперь я знаю, что я сделал неправильно, большое спасибо :) Мне нужно было передать объект со значением, id и метку в значение:)

1 Ответ

0 голосов
/ 25 сентября 2019

Мне нужно было передать объект следующим образом: {"value":0,"label":"v1","id":0} в значение

...