我尝试通过类似http://localhost/api/offer/get-offerlist?id=${userId}
的方式获取数据,userId从react原生AsyncStorage获取。
问题是我无法在渲染屏幕前从第一次获取数据。在第二次刷新屏幕后,数据成功获取。
代码:
const [userId, setUserID] = useState("");
const [list, setList] = useState("");
const [loading, setLoading] = useState(false);
const [getStationsId, setGetStationsId] = useState("");
const [filterRecord, setFilterRecord] = useState("");
const getOfferList = async () => {
try {
setLoading(true);
const userId = await AsyncStorage.getItem('userId');
const response = await fetch(
`http://localhost/api/offer/get-offerlist?id=${userId}`,
{
headers: {
accept: 'application/json',
'Content-Type': 'application/json'
},
},
);
const data = await response.json();
//StationID from result Object
const extractedStationId = data.map((item) => item.result);
setGetStationsId(extractedStationId);
const myArrayFiltered = data.filter((el,index) => {
return getStationsId[index].some(f => {
return f.offerUserId === el.userId;
});
});
setLoading(false);
setList(data);
setFilterRecord(myArrayFiltered);
} catch (e) {
console.log(e);
setLoading(false);
}
};
useEffect(() => {
getOfferList();
}, []);
我希望我能够第一次使用从移动的本地存储获得的用户ID获取数据。
1条答案
按热度按时间l7wslrjt1#
使用UseLayoutEffect而不是useEffect,然后添加if loading = true以返回正在加载的文本,如果没有加载,则返回主要内容。