'how to set selected value after loadOptions success in AsyncSelect

I want to set the selected value to AsyncSelect I am fetching data in loadOptions and it works good, then i saved only value in database not label, now i want set selected that value for edit it

<AsyncSelect
                            id="gender"
                            name="gender"
                            className="is-invalid"
                            cacheOptions
                            loadOptions={() =>
                              getSelectOptions(
                                "tbl_master_gender",
                                "gender_value"
                              )
                            }
                            defaultOptions
                            defaultValue={intialData.gender}
                            isSearchable={false}
                            onBlur={() =>
                              validation.setFieldTouched("gender", true)
                            }
                            onChange={(option: any) => {
                              validation.setFieldValue("gender", option.value);
                            }}
                          />


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source