why is react select default value not working

Question

I am trying to use react select and trying to set a defaultValue but when I set a default value it does not appear on my dropdown. I have tried everything and then came here for help. any help would be appreciated. below attached is the code :

<Select
  classNamePrefix="react-select"
  options={
    countryDetails
      ? countryDetails.map((c) => ({
          label: c.label.split("-")[0],
          value: c.value
        }))
      : [{ label: "", value: "" }]
  }
  name="operatingCountry"
  placeholder={t("Select Country")}
  components={{ ValueContainer: CustomValueContainer }}
  defaultValue={
    (console.log(
      "country boy",
      countryDetails.find((c) => c.value == defaultCountryUser)
    ),
    countryDetails.find((c) => c.value == defaultCountryUser))
  }
  value={this.props.basicInfo["operatingCountry"].value}
  onChange={({ label, value }) => {
    this.props.selectChanged(
      "operatingCountry",
      { label, value },
      sectionKey
    );
  }}
/>

the console in the defaultValue gives result in console. as an object {label:"two",value:2}

Madhan S · Accepted Answer · 2022-03-05 14:06:18Z

1

The value should be an object. Try changing value to this:

value={this.props.basicInfo["operatingCountry"]}

answered Mar 5, 2022 at 14:06

Madhan S

6931 gold badge6 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

zaid Over a year ago

this value = {this.props.basicInfo["operatingCountry"].value} already returns me the object

Madhan S Over a year ago

What is the type of defaultCountryUser. Objects in JavaScript always returns false when compared.

Collectives™ on Stack Overflow

why is react select default value not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related