Javascript 访问@ngrx效果中的动作道具,多个动作的类型为OF
我使用类型为的Javascript 访问@ngrx效果中的动作道具,多个动作的类型为OF,javascript,angular,typescript,redux,ngrx,Javascript,Angular,Typescript,Redux,Ngrx,我使用类型为的操作符有两个动作和这两个动作的效果,如下所示: export const myActions = { actionA: createAction(`actionA`, props<{ a: string }>()), actionB: createAction(`actionB`, props<{ b: number }>()) } myEffect$ = createEffect(() => this.actions$.pipe(
操作符有两个动作和这两个动作的效果,如下所示:
export const myActions = {
actionA: createAction(`actionA`, props<{ a: string }>()),
actionB: createAction(`actionB`, props<{ b: number }>())
}
myEffect$ = createEffect(() =>
this.actions$.pipe(
ofType(myActions.actionA, myActions.actionB),
mergeMap(action => {
// How to convert action object to correct type and access action.a or action.b props?
if (action.type == myActions.actionA) {
console.log(action.a); // compile error
} else if (action.type == myActions.actionB) {
console.log(action.b); // compile error
}
})
), {dispatch: false}
);
export const myActions={
actionA:createAction(`actionA`,props()),
actionB:createAction(`actionB`,props())
}
myEffect$=createEffect(()=>
此.actions$管道(
类型(myActions.actionA、myActions.actionB),
合并映射(操作=>{
//如何将action对象转换为正确的类型并访问action.a或action.b道具?
if(action.type==myActions.actionA){
console.log(action.a);//编译错误
}else if(action.type==myActions.actionB){
console.log(action.b);//编译错误
}
})
),{dispatch:false}
);
如何检查和访问动作的道具(action.a和action.b)以及IDE中的自动完成功能?的类型将作为动作的通用参数类型,例如,的类型(actionType)
,然后合并映射参数将在不键入的情况下键入为动作
在您的情况下,action
参数也可以是ActionA
或ActionB
,因此您必须编写类型(actionTypeA,actionTypeB)
,然后来自mergeMap的action
将被键入为ActionA
和ActionB
的并集。但是在适当的if分支中,比如(action.type==myActions.actionA)
操作将只被actionA
类型化,因为TS编译器理解一些ifs语句
顺便说一句@timdeschryver的建议是将其分为2个效果非常好
===================已编辑=================
如果您是通过export const actionA=createAction('actionA',props())
定义操作,则可以通过type actionA=ReturnType声明actionA的类型代码>ReturnType
是添加到TypeScript中的通用工具。为什么不创建两种效果?redux开发工具呢@timdeschryver为什么不创建两个效果?=>我需要actionA和actionB的值,用于之后相同的逻辑。在这个例子中,我简化为2个动作。但我实际上需要5个具有相同逻辑的动作,不想创建5个效果。@PrzemyslawJanBeigert我使用console.log只是一个例子。在现实生活中,我使用了其他的效果。@XuanDaiNguyen比答案是,这取决于你,但你应该有一个很好的理由不使用2效果。潜在替代效果3,2映射到具有相同道具类型的普通动作,1个效果实现普通动作。没有具体的想法就无法探索你的答案!我使用createAction('actionA',props())
,那么我如何定义类型actionA
?我在编辑的部分添加了说明。请让我知道这是否回答了你的问题/非常感谢!它起作用了<代码>类型ActionA=返回类型代码>console.log((作为ActionA.a的操作)