我尝试查找此方案的最佳做法,但找不到。ngrx/reducex操作环境的最佳做法
问题: 我不想再重复动作的文件,就像在我的例子 家todos.actions和运动待办事项-行动,我想用同样的对dos.action文件。和相同的减速器。
例如: 我写例如待办事项应用程序,在这个例子中,你可以看到这个问题,如果我派遣一个行动型“ADD_TODO_ASYNC”,它会在家里(效果和减速机)派遣,和运动(效果减速机)
todos.actions.ts
const ADD_TODO_ASYNC = 'ADD TODO ASYNC';
const ADD_TODO_COMPLETE = 'ADD TODO COMPLETE';
const ADD_TODO_FAILD = 'AD TODO FAILD';
class addTodoComplete {
type = ADD_TODO_COMPLETE;
}
class addTodoFaild {
type = ADD_TODO_COMPLETE;
}
export type Actions = addTodoComplete | addTodoFaild;
sport.effects.ts
@Injectable()
export class SportTodosService {
@Effect() ADD_TODO_ASYNC$ = this.actions$.ofType(TodosActionTypes.ADD_TODO_ASYNC)
.map(toPayload)
.swithMap((todo: Todo) => this.api.addTodo(todo))
.map((todo: Todo) => TodosActionTypes.addTodoComplete(todo))
constructor(
private actions$: Actions,
private api: api
) { }
}
个home.effects.ts
export class HomeTodosService {
@Effect() ADD_TODO_ASYNC$ = this.actions$.ofType(TodosActionTypes.ADD_TODO_ASYNC)
...
constructor(
...
) { }
}
减速
function todosReducer(state, action: TodosActionTypes.Actions) {
switch (action.type) {
case TodosActionTypes.ADD_TODO_COMPLETE:
return state;
default:
return state;
}
}
app.module.ts
@NgModule({
declarations: [
AppComponent
],
imports: [
StoreModule.forRoot({
sport: todosReducer,
home: todosReducer,
}),
EffectsModule.forRoot([
SportTodosService
HomeTodosService,
])
],
providers: [
api
],
bootstrap: [AppComponent]
})
export class AppModule { }
我试着去了解什么是此方案的最佳实践? 用“HOME_ADD_TODO”&'SPORT_ADD_TODO'等上下文编写动作?
还是有官方的方式?
,如果你知道解决办法,如果该解决方案是终极版,不关心或NGRX
感谢所有
我知道名称间距,但我填写,如果我有我的应用程序中的10个主题待办事项我会复制过去相同的操作? 和你的解决方案,我将如何处理它在一个reducer? – Alin
我想你不明白我的问题!因为在你的方式,我需要写减速器和行动两次 – Alin