减速器返回的状态应该遵循相同的形状吗?

时间:2017-11-28 03:39:43

标签: angular ngrx reducers

https://medium.com/front-end-hacking/an-intro-to-ngrx-effects-ngrx-store-with-angular-4-c55c4d1d5baf

https://github.com/aravindfz/ngrx-store-demo(代码)

基于本教程,我对状态reducer需要返回感到困惑。我一直认为reducer应该是app-wide reducer来返回下一个应用程序状态。但是本教程有一个authorFilter reducer,它返回一个用于进行过滤的状态。

// reducer: authorFilter
export const authorFilter = (state = blogs => blogs, action: any) => {
    switch (action.payload && action.payload.type) {
        case 'All': {
            return blogs => blogs;
        }
        case 'Other': {
            return blogs => blogs.author === action.payload.value;
        }
        default: {
            return state;
        }
    }
};

当主减速器

// reducer: blog
export const blog = (state: any = [], action) => {
    switch (action.type) {
        case 'ADD_BLOG_SUCCESS': {
            return { data: [...state.data, action.payload] }
        }
        case 'LOAD_BLOGS_SUCCESS': {
            return { ...state, data: action.payload }
        }
        case 'DELETE_BLOG_SUCCESS': {
            return {
                data: state.data.filter(blog => {
                    return blog.id !== action.payload.id;
                })
            };
        }
        default: {
            return state;
        }
    }
};

然后在主要组件

  ngOnInit() {
    this.blogs$ = Observable.combineLatest(
      this.store.select('blog'),
      this.store.select('authorFilter'),
      (blogs: any, authorFilter: any) => {
        return blogs.data ? blogs.data.filter(authorFilter) : [];
      }
    );

    this.loadBlogs();
  }

  ngOnChanges() {
  }

  loadBlogs() {
    this.store.dispatch(this.blogActions.loadBlogs('All'));
  }

由于在不同的reducer(blog和authorFilter)中返回不同的状态,我应该将其视为不同的商店吗?我认为状态如果应用程序状态共享相同的形状..

0 个答案:

没有答案