设置默认值时react-select不起作用 [英] Setting a default value with react-select not working

问题描述

我有一个简单的React组件，它具有初始状态:

I have a simple React component which gets an initial state:

this.state = {
  currentObject: {
    isYounger: false
  }
}

然后我渲染一个 react-select ，其默认值为 this.state.currentObject.isYounger :

I then render a react-select with the default value of this.state.currentObject.isYounger:

    <Select
      name={"age"}
      value={this.state.currentObject.isYounger}
      onChange={newValue => this.addIsYoungerValue(newValue)}
      options={isYoungerOptions}
    />

由于某些原因，未设置该值.为什么会这样?

For some reason, the value is not set. Why is this?

代码框

版本:

"react-select":"^ 2.4.2"，

推荐答案

这里的问题不在于状态选择，实际的问题是未显示标签.

Here the issue is not with state selection, the actual issue is that the label is not getting displayed.

因此，根据您的 addIsYoungerValue 函数，您要将 this.state.currentObject.isYounger 的值设置为整个对象.即 {值:true，标签:"Younger"} .因此，可以通过以下更改初始状态的值来解决该问题.

So, as per your addIsYoungerValue function you are setting the value of this.state.currentObject.isYounger to whole object. i.e. { value: true, label: "Younger" }. So, the issue can be solved by changing the value of initial state by below.

this.state = {
      array: [],
      currentObject: {
        isYounger: { value: true, label: "Younger" }
      }
    };

然后hurrey，将显示默认值标签.

And hurrey, the default value label will be shown..

这篇关于设置默认值时react-select不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！