将默认值设置为更新表单中的反应选择

Question

我很陌生反应，

我正在尝试使用React-Select编写更新表格 我很难设置默认选择

  let flight = useLocation();
  if (flight.state) {
    flight = flight.state.flightobj
  }

的是需要更新的飞行数据（从上一页获取）

(airlineOptions?.find(({ label }) => label === flight?.airline)

查找选项并为选择

问题格式化是因为它只是不设置默认值，我尝试做set set set set <代码> {label，value} 手动起作用。

第二个问题 onsubmit 中的prop选择由于某种原因不发射。 onsubmit形式明智的做法。我从代码中排除了onsubmit。

const CreateFlightForm = () => {
  let flight = useLocation();
  if (flight.state) {
    flight = flight.state.flightobj
  }

  let [airlineOptions, setAirlineOptions] = useState()
  let [airline, setAirline] = useState()
  let [opt, setOpt] = useState(airlineOptions ? .find(({
    label
  }) => label === flight ? .airline));


  const handleSubmit = (e) => {
    e.preventDefault();
    // ... sends to db

  }

  useEffect(() => {
    getAirlines()
  }, [])


  // let defaultval = () => {
  //   let test = airlineOptions?.find(({ label }) => label === flight?.airline)
  //   // console.log(test);
  //   setOpt(test)
  // }


  let getAirlines = async() => {
    let response = await fetch(`/backend/airlines`)
    let data = await response.json()
    setAirlineOptions(data.map((airline) => ({
      value: airline.id,
      label: airline.name
    })))

  }


  return ( <
    div className = 'create' >
    <
    FormHeader headercheck = {
      flight
    }
    /> <
    form id = 'app_form'
    onSubmit = {
      (e) => handleSubmit(e)
    } >
    <
    label > Airline < /label>               <
    Select required id = 'airline'
    isClearable = {
      true
    }
    options = {
      airlineOptions
    }
    defaultValue = {
        opt
     }

    isSearchable = {
      true
    }
    onChange = {
      (e) => {
        if (e) setAirline(e.value)
      }
    }
            defaultValue = {opt}

    /> <
    input type = 'submit' > < /input>


    <
    /form>

    <
    /div>



  )

}

export default CreateFlightForm