gpt4 book ai didi

angular5 - ngxs、redux 开发工具显示以前的状态

转载 作者:行者123 更新时间:2023-12-05 06:36:25 25 4
gpt4 key购买 nike

这是一个simple example .

在 console.log 中,状态已正确更新。模板也已正确更新。

在 redux 开发工具中,状态会随着调度的延迟而更新。

为了更清楚,初始状态是:

{data: [], loading: false, counter: 0}

当我单击“获取”按钮时,组件会分派(dispatch)两个事件:

this.ngxs.dispatch(new LoadingData());
this.ngxs.dispatch(new GetData());

LoadingData 只是清空数据数组并将加载设置为 true:

@Mutation(LoadingData)
loadingData(state){
state.data = [];
state.loading = true;
}

在控制台和模板中,状态更新正确,但在 redux 开发工具中加载仍然是错误的:

enter image description here

GetData 是一个 Action,它执行返回 Observable 的服务方法,然后分派(dispatch)两个事件 DataSuccess 和 Increase:

@Action(GetData)
getData(state){
return this.as.list().map(data => [
new DataSuccess(data),
new Increase(),
]);
}

只有现在,在 redux dev tools loading 中设置为 true

仅增加计数器,DataSuccess 将加载设置为 false 并填充数据数组:

@Mutation(Increase)
increase(state){
state.counter = state.counter + 1;
}

@Mutation(DataSuccess)
dataSuccess(state, {payload}){
state.data = payload;
state.loading = false;
}

DataSuccess 在Increase 之前执行。在 redux 开发工具中,DataSuccess 加载仍然设置为 true 并且数据数组仍然是空的。

在 redux 开发工具中,Increase 数据数组最终被填充,但计数器设置为 0。

所以 redux 开发工具总是显示以前的状态。我是 redux/ngrx/ngxs 的新手,所以我不知道这种行为是否是我的错。我真的很感激任何提示或更正以使其以正确的方式工作。

最佳答案

这是框架的一个bug,最近已经解决了:)

关于angular5 - ngxs、redux 开发工具显示以前的状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49114065/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com