问题描述
我有一个反应应用程序。我正在使用 mobx 进行中央状态管理。
我安装了这两个包:
"mobx": "^6.3.0","mobx-react-lite": "^3.2.0",
我的文件如下所示:
export default class ActivityStore {
constructor() {
makeAutoObservable(this);
}
loadActivities = async () => {
this.loadingInitial = true;
try {
const activities = await agent.Activities.list();
console.log(activities);
activities.forEach((activity) => {
activities.push(activity);
});
this.loadingInitial = false;
} catch (error) {
console.log(error);
this.loadingInitial = false;
}
};
}
app.tsx:
useEffect(() => {
activityStore.loadActivities();
},[activityStore]);
<ActivityDashboard
activities={activityStore.activities}
/>
export default observer(App);
所以我看到了来自 API 调用的数据。在控制台中。
但我在网络视图中看不到数据。
那么我必须改变什么?
谢谢
解决方法
实际上您的商店中没有 activityStore.activities
属性,您可能错过了那部分!
export default class ActivityStore {
// Add class property with some default value,array in this case
activities = []
// It is better to declare all properties beforehand,so delcare this one too
loadingInitial = false
constructor() {
makeAutoObservable(this);
}
loadActivities = async () => {
this.loadingInitial = true;
try {
const activities = await agent.Activities.list();
// Assign fetched activities to class property right here
this.activities = activities;
this.loadingInitial = false;
} catch (error) {
this.loadingInitial = false;
}
};
}