如何在反应选择异步中取回值选择答案

【问题标题】：how to get back value select in react-select Async如何在反应选择异步中取回值选择
【发布时间】：2020-01-14 23:07:35
【问题描述】：

我使用react-select 创建了一个异步选择。我可以显示从 API 获取的值。但是当用户选择其中之一时，如何找到选择了哪一个。这是loadOptions 方法：

const loadOptions = (selectedOption, callback) => {
        let xml = `my xml data`;
        axios.post('test.com', xml, { headers: { 'Content-Type': 'text/xml;charset=UTF-8' } }).then(function (response) {
            //console.log(response)
            var options = {
                attributeNamePrefix: "@_",
                attrNodeName: "attr", //default is 'false'
                textNodeName: "#text",
                ignoreAttributes: true,
                ignoreNameSpace: false,
                allowBooleanAttributes: false,
                parseNodeValue: true,
                parseAttributeValue: false,
                trimValues: true,
                cdataTagName: "__cdata", //default is 'false'
                cdataPositionChar: "\\c",
                localeRange: "", //To support non english character in tag/attribute values.
                parseTrueNumberOnly: false,
                attrValueProcessor: a => he.decode(a, { isAttributeValue: true }),//default is a=>a
                tagValueProcessor: a => he.decode(a) //default is a=>a
            };
            // Intermediate obj
            var tObj = parser.getTraversalObj(response.data, options);
            var jsonObj = parser.convertToJson(tObj, options);
            if (jsonObj["soap:Envelope"]["soap:Body"].GetAllCategoriesResponse.GetAllCategoriesResult["diffgr:diffgram"].DocumentElement != null) {
                var jsonDropDownDetails = jsonObj["soap:Envelope"]["soap:Body"].GetAllCategoriesResponse.GetAllCategoriesResult["diffgr:diffgram"].DocumentElement.CATEGORY

                jsonDropDownDetails.map(item => {
                    const data = { value: item.CATEGORYNAME, label: item.CATEGORYNAME, index: item.CATEGORYID }
                    setDropDownOptions(dropDownOptions.push(data))
                })
                callback(dropDownOptions)
            }
        }).catch(function (error) {

            console.log("erorr in DropDown : " + error)
        })
    };

这是我的handelChange 方法：

const handleChange = selectedOption => {
        console.log(selectedOption)
    };

这是我的 AsyncSelect：

         <AsyncSelect
            styles={customStyles}
            cacheOptions
            loadOptions={loadOptions}
            defaultOptions
            onInputChange={handleChange}
            isRtl={true}
            isSearchable={false}
            classNamePrefix='myDropDown'
        />

如何回调选择了哪个值？

【问题讨论】：

标签： reactjs react-select

【解决方案1】：

在不更改处理程序的情况下将 onInputChange 更改为 onChange，selectedOption 现在应该可以工作了

onChange={handleChange}

【讨论】：