Question

我有一个react组件，我想在此组件中添加预定义值。我怎么做？我的反应选择框组件如下所示：

import React from 'react';
import createClass from 'create-react-class';
import PropTypes from 'prop-types';
import Select from 'react-select';

var CreatableDemo = createClass({
displayName: 'CreatableDemo',
propTypes: {
    hint: PropTypes.string,
    label: PropTypes.string
},
getInitialState () {
    return {
        multi: true,
        multiValue: [],
        options: [],
        skills_data: [],
        value: undefined
    };
},
handleOnChange (value) {
    const { multi } = this.state;
    if (multi) {
        this.setState({ multiValue: value });

    } else {
        this.setState({ value });
    }
    let skills_arr = [];
    if(value != []){
        for(let i = 0; i < value.length; i++){
            skills_arr.push(value[i].value);
        }
        this.props.handleSkillsChange(skills_arr);
        this.setState({ skills_data: skills_arr });
    }
    else{ 
        this.setState({ skills_data: [] });
        this.props.handleSkillsChange(this.state.skills_data);
    }
},
render () {
    const { multi, multiValue, value, options } = this.state;
    return (
        <div className="section">
            <div className="validate-input m-b-26 div-space form-div" data-validate="Skills are required">
                <span className="label-input100">Skills</span>
                <Select.Creatable   multi={multi} options={options} onChange={this.handleOnChange} value={multi ? multiValue : value}/>
                <div className="hint">{this.props.hint}</div>

            </div>
        </div>
    );
}
});

export default CreatableDemo;

我试着查看其他答案，但这并没有解决我的问题。我将数组中的默认值也添加为multiValue。它没有解决问题

Answer 1

您没有放置组件的完整代码，我不知道multi和multiValue值！

但它在价值道具value={multi ? multiValue : value}处接缝问题。您检查存在multi并传递multiValue，但multiValue可能未定义！

你的代码应该是这样的：

<Select.Creatable
    ...
    value={multiValue ? multiValue : value}
/>

如何在react-select中添加默认值？

1 个答案: