ngrx updating state based on the angular2-router r

2019-07-27 04:21发布

So, continuing working on the redux-based Angular2 app with REST server. In the app I have the following reducers:

  1. AuthReducer -> AuthState
  2. UserReducer -> UserState
  3. UserListReducer -> UserListState
  4. ArticleReducer -> ArticleState
  5. ArticleListReducer -> ArticleListState

The app uses many of those reducers in multiple places (i.e. pages/routes). The app state itself is composed the following way (app routes are in the comments):

export interface AppState
{
  localUser: AuthState

  //homePage with random article (/)
    homeArticle: ArticleState

  //profilePage (/profile)
    profileInfo: UserState // (profile/info)
    profileArticles: ArticleListState // (profile/articles)
    favouriteArticles: ArticleListState // (profile/favourite)
    subscribers: UserListState // (profile/subscribers)

  //userPage (when local user navigates to article's publisher's profile)
  // (/user/:id)
    userInfo: UserState // (/user/:id/info)
    userArticles: ArticleListState // (/user/:id/articles)
    userSubscribers: UserListState // (/user/:id/subscribers)

  //feedPage (/feed)
    feed: ArticleListState

  //.....
}

So, basically, if I need (in theory) to cache and retrieve the whole app State, information from all pages will be recovered.

So, let's consider the following scenario as an example: I am on the profile/articles page as an authenticated user. I want to create a new article.

  1. My ArticleListComponent on that page dispatches CREATE_ARTICLE action to the store ------- ( how does the store know which list state to update? )
  2. ArticleListReducer processes that action
  3. @Effect takes place sends data to the backend
  4. CREATE_ARTICLE_SUCCESS is invoked and processed via ArticleListReducer
  5. Article is created ?successfully. It's in the list and displayed on the page.

Now, two questions:

  1. Would such application structure be fine in general?
  2. How do I properly update the appropriate state?

EDIT

I'm just guessing it could be somehow managed conditionally depending on the current route. But not sure whether it is the solution.

0条回答
登录 后发表回答