Question

我在当前的应用中使用react-select并且似乎找不到获取未选择值的方法。我有新的反应，所以也许有一个＆＃34;反应＆＃34;这样做的方式对我来说并不明显。似乎很奇怪，我无法在任何地方找到任何提及。

这是我能提出的最佳方式，它似乎很迟钝：

class ProductMultiSelect extends Component {
    constructor(props) {
        super(props)

        this.state = {
            selectedValues: []
        }

        this.onChange = this.onChange.bind(this)
    }

    onChange (value) {

        // Update Redux Form
        this.props.input.onChange(value)

        const newValues = value.map( product => product.value)

        if (newValues.length == 0 || newValues.length < this.state.selectedValues.length) {
            const removedValue = this.state.selectedValues.filter(x => newValues.indexOf(x) < 0 );
            this.setState({selectedValues: newValues})
        } else {
            const newValue = newValues.filter(x => this.state.selectedValues.indexOf(x) < 0 );
            this.setState({selectedValues: newValues})
        }
    }

    render() {
        return (
            <Select
                {...this.props}
                value={this.props.input.value}
                multi
                onChange={(value) => this.onChange(value)}
                onBlur={() => this.props.input.onBlur(this.props.input.value)}
                options={this.props.options}
                className='form-group'
            />
        )
    }
}

export default ProductMultiSelect

Answer 1

这取决于您要访问未选择值的位置。我假设未选择的值是您之前状态的一部分？如果是这种情况，您可以使用接受函数而不是对象的this.setState版本访问它们。它看起来像这样（从他们的文档中提取）。如果未选中的值是您之前状态的一部分，那么您可以在此处执行任何您喜欢的操作。

this.setState((prevState, props) => ({
  counter: prevState.counter + props.increment
}));

参考此处：https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous

React-Select - 获取未选择的值

1 个答案: