Store vs Store<T>

拜拜、爱过 提交于 2019-12-13 18:03:25

问题


I'm pretty much a novice with the redux pattern and have just started using ngrx. It's awesome and it's something I want to use as much as possible, but I have a couple of questions regarding the Store concept.

I will try to describe the problem through a few samples and ask my question at the end of this post.

Let's start with the AppState interface and reducers:

export interface AppState{
   people: Person[],
   events: Event[]
}

//events reducer
export function eventsReducer(state: any = {}, {type, payload}): Event[]{
  switch(type){
    case "ADD_EVENT":
      return [...state, payload];
    default:
      return state;
  }
}

//people reducer
export function peopleReducer(state: any = {}, {type, payload}): Person[]{
  switch(type){
    case "ADD_PERSON":
      return [...state, payload];
    default:
      return state;
  }
}

//root reducer
const root: ActionReducer<AppState> = combineReducers({people: peopleReducer, events: eventsReducer});
const INITIAL_STATE = {
   people:[],
   events: []
}
export function rootReducer(state: any = INITIAL_STATE, action: any){
   return root(state, action);
}

rootReducer is added like this:

//part of the AppModule
...
imports:[
...,
StoreModule.provideStore(rootReducer)
]

And in the main AppComponent here is how I'm accesing the store:

//part of the AppComponent
export class AppComponent{
   people: Observable<Person[]>;
   events: Observable<Event[]>;

   constructor(private store: Store<AppState>){
      this.people = store.select('people');
      this.events = store.select('events');
   }
}

Now, everything works correctly and I really like this concept, but I've noticed that nothing changes (or breaks) if I remove one of the properties from the AppState interface (for example, I remove the people property, everything else stays the same).

So I would like to know what is the main reason for having Store<AppState> instead of just Store and what are the main advantages of using Store<AppState> (where it's actually made a difference against just using Store)? Also, is there a way to enforce at least runtime errors when AppState changes, but everything else stays the same?

The possibility of me using it wrong is very high as well, but I would still like to know answers to these questions.


回答1:


The store's select method can be passed one or more property strings or a selector function.

When passed property strings, it behaves like pluck. And when passed a selector function, it behaves like map.

The significant difference between these is that the property path(s) passed to pluck cannot be type checked and pluck returns Observable<any>, so the state's type information is essentially lost.

If you use selector functions, instead, you will see TypeScript errors for missing properties, etc.

For example, this:

store.select(state => state.missing);

will effect an error, whereas this will not:

store.select('missing');


来源:https://stackoverflow.com/questions/44510266/store-vs-storet

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!