这就是我尝试使用 useEffects
在我的组件中填充两个下拉菜单的方式。
function populate_dropdown_one_data() {
return axios.get("http://127.0.0.1:5001/dropdownonedata");
}
function populate_dropdown_two_data() {
return axios.get("http://127.0.0.1:5000/dropdowntwodata");
}
React.useEffect(() => {
populate_dropdown_one_data()
.then(result => {
setDropDownOneData(result.data.data);
});
}, []);
React.useEffect(() => {
populate_dropdown_two_data()
.then(result => {
setDropDownTwoData(result.data.data);
});
}, []);
这只会在页面加载时调用 populate_dropdown_one_data
。
如果我将 populate_dropdown_one_data
和 populate_dropdown_two_data
组合在一个 useEffect
中,它只会调用 populate_dropdown_two_data
。
如何在页面加载时为两个下拉菜单填充数据?
最佳答案
State update is not batched for asynchronous operations .
您可以await
一个effect 中的两个操作。
React.useEffect(
() => {
const fetchData = async () => {
const one = await populate_dropdown_one_data();
const two = await populate_dropdown_two_data();
setDropDownOneData(one.data.data);
setDropDownTwoData(two.data.data);
};
fetchData();
},
[]
);
关于javascript - 使用 useEffect 填充多个下拉数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58479281/