[英]How to select option from api response REACT-JS
我有 select 的組件,我希望當響應返回時, SelectM
具有選定的數據並顯示
import Select from "react-select";
<Select
menuPlacement="auto"
menuPosition="fixed"
styles={colourStyles}
closeMenuOnSelect={false}
components={animatedComponents}
isMulti
options={colourOptions}
onChange={handleChangeSelect}
placeholder="color"
/>
這是選項
const colourOptions = [
{ value: 'red', label: 'red' },
{ value: 'blue', label: 'blue' },
{ value: 'green', label: 'green' },
];
這是handleChangeSelect
const handleChangeSelect = (e) => {
setSelectedValue(Array.isArray(e) ? e.map((x) => x.value) : []);
};
這是我的回復數據
ResData= [1,2]
我想從ResData
獲得 select
看來您可以使用react-select
的setValue
方法。
setValue([{value: 'optionA', label:'Option A'}]);
在您的情況下,它將類似於:
const responseData= [1,2];
const colourOptions = [
{ value: 'red', label: 'red' },
{ value: 'blue', label: 'blue' },
{ value: 'green', label: 'green' },
];
const optionsToSelect = colourOptions.filter((option, i) => responseData.includes(i));
...
setValue(optionsToSelect);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.