Несколько вызовов с зависимостями redux-thunk - PullRequest
5 голосов
/ 19 января 2020

Вопрос:

Я использую redux-thunk и хочу получать сообщения. Для получения сообщений мне нужно получить пользователей. Итак, у меня есть сомнения по поводу моего блока. Правильно ли получить все данные в один блок, если нет, как разделить его на два блока?

Пример блока:

export default group_id => {
  return async dispatch => {
    const users = await API.get(`/users?group_id=${group_id}`) // get users
    const posts = await axios.all([...getPosts(users)]) // get all posts by user ids
    dispatch(loadUsersAction(users))
    dispatch(loadPostsAction(posts))
  }
}

1 Ответ

1 голос
/ 19 января 2020

Может быть несколько подходов в зависимости от ваших требований.

Если целью является загрузка, сначала пользователей, а затем их сообщения, я сначала позвоню /users, а затем отправлю другому создателю действия, чтобы получить /posts. Потому что, собрав все это вместе, пользователи будут дольше ждать, пока что-то изменится в пользовательском интерфейсе (например, загрузка счетчика), поэтому я разделю их на два отдельных действия.

export function getUsers(group_id) => {
  return async dispatch => {
    const users = await API.get(`/users?group_id=${group_id}`); 
    dispatch(loadUsersAction(users));
    return users;
  };
};

export function getPostForGroupUsers (group_id) => {
  return async dispatch => {       
    const users = await dispatch(getUsers(group_id));
    const posts = await axios.all([...getPosts(users)]);
    dispatch(loadPostsAction(posts));
    return posts;
  }
}

// or just call users, dispatch and get them from store

export function getPostForAllUsers  () => {
  return async dispatch => {       
    // this depends on your implementation
    const users = getFromReduxStore('users');
    const posts = await axios.all([...getPosts(users)]);
    dispatch(loadPostsAction(posts));
    return posts;
  }
}

Может быть, вы можете предоставить более подробную информацию о вашем деле, тогда я мог бы дать более точный ответ.

...