[英]How to set default value of react-select after getting data from API
I have a react select component I want to update data so when I fetch data from my API i want to set my data to react select I use this code.我有一个反应选择组件,我想更新数据,因此当我从 API 获取数据时,我想将数据设置为反应选择我使用此代码。
I have create state and use useEffect to fetch data from an API我创建了状态并使用 useEffect 从 API 中获取数据
const [currency, setCurrency] = useState([]);
useEffect(() => {
if (sessionStorage.getItem('AccountId')) {
axios.get(process.env.REACT_APP_SQL_API_URL + 'Organisation/' + query.search.split('=')[1])
.then(res => {
setCurrency({ label: res.data[0].currency, value: res.data[0].currency });
})
.catch(error => console.log(error.response))
}
else {
history.push('/login')
}
}, [])
This is the react select code这是反应选择代码
<Controller
rules={{ required: true }}
name="currency"
control={control}
render={({ field: { onChange } }) =>
<Select
onChange={(e) => {
onChange(e)
//handleSelect(e)
}}
options={[{ value: 'USD', label: 'USD $' }, { value: 'TZS', label: 'TZS' }]}
defaultValue={[currency]}
/>
}
/>
you need to have a state :你需要有一个状态:
const [currency, setCurrency] = useState([]);
<Controller
rules={{
required: true }}
name="currency"
control={control}
render={({ field: { onChange } }) =>
<Select
onChange={(e) => {
onChange(e)
//handleSelect(e)
console.log(e.target);
console.log(e.target.value);
setCurrency(state=>[ //change state ])
}}
options={[{ value: 'USD', label: 'USD $' }, { value: 'TZS', label: 'TZS' }]}
defaultValue={currency}
value={currency}
/>
}
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.