Javascript 如何在Ngrx 9.x中设置状态值?
我正试图找出如何在最新版本的Ngrx中设置特定值。文档提到了如何在存储中增加/减少/重置值,但我没有看到任何关于如何动态设置值或如何将参数传递给还原器的示例 这是我目前所拥有的,但我知道这是不正确的: 我的行动:Javascript 如何在Ngrx 9.x中设置状态值?,javascript,angular,redux,ngrx,Javascript,Angular,Redux,Ngrx,我正试图找出如何在最新版本的Ngrx中设置特定值。文档提到了如何在存储中增加/减少/重置值,但我没有看到任何关于如何动态设置值或如何将参数传递给还原器的示例 这是我目前所拥有的,但我知道这是不正确的: 我的行动: // TODO: properly implement action export const setLabel = createAction('[Label Component] Set, props<{ addressField: string }>()'); 最后
// TODO: properly implement action
export const setLabel = createAction('[Label Component] Set, props<{ addressField: string }>()');
最后,我的组成部分:
// imports...
export class MyComponent implements OnInit {
constructor( private store: Store<AppState>,
private AddressService: AddressService) {
}
ngOnInit() {
// TODO: update store state:
this.AddressService.getFields().subscribe(x => {
this.store.dispatch(setLabel({ addressField: x.addressLine }));
});
}
}
//导入。。。
导出类MyComponent实现OnInit{
构造函数(私有存储:存储,
专用地址服务:地址服务){
}
恩戈尼尼特(){
//TODO:更新存储状态:
这个.AddressService.getFields().subscribe(x=>{
dispatch(setLabel({addressField:x.addressLine}));
});
}
}
有关更多信息,请参阅
或者,只是使用
const entityReducer=createReducer(
{
实体:{},
},
mutableOn(create,(state,{type,…entity})=>{
state.entities[entity.id]=实体
}),
mutableOn(更新,(状态,{id,newName})=>{
const entity=state.entities[id]
if(实体){
entity.name=newName
}
}),
mutableOn(remove,(state,{id})=>{
删除state.entities[id]
}),
)
actions.ts
export enum ActionTypes {
SetLabel = '[Label Component] Set'
}
export const SetLabel = createAction(ActionTypes.SetLabel, props<{ addressField: string }>());
您的组件很好,在处理副作用(异步数据)时使用效果更好。创建操作的方法很多。使用应该允许您将动态数据传递给减速器。@AndreiGătej,链接已断开…@JohnSpiteri谢谢,这是更新的链接。
on(setLabel, state => {
return {
...state,
propToUpdate: 'foo'
};
})
on(setLabel, (state, action) => {
return {
...state,
propToUpdate: action.propToSet
};
})
const entityReducer = createReducer<{ entities: Record<number, { id: number; name: string }> }>(
{
entities: {},
},
mutableOn(create, (state, { type, ...entity }) => {
state.entities[entity.id] = entity
}),
mutableOn(update, (state, { id, newName }) => {
const entity = state.entities[id]
if (entity) {
entity.name = newName
}
}),
mutableOn(remove, (state, { id }) => {
delete state.entities[id]
}),
)
export enum ActionTypes {
SetLabel = '[Label Component] Set'
}
export const SetLabel = createAction(ActionTypes.SetLabel, props<{ addressField: string }>());
export interface AppState {
addressField;
}
export initialState: AppState = {
addressField: ''
}
const _reducer = createReducer(
initialState,
on(SetLabel, (state, { addressField }) => {
return {
...state,
addressField
};
})
);