react-redux - saga 发送到 redux 商店后如何重新渲染组件

Question

我正在使用反应钩子和 redux 钩子。

我有一个检查 redux 状态的组件。如果状态不存在，它将执行useDispatch获取所需书籍的操作。

在传奇中，有各种各样的功能，但我只是发布了保存到商店的最后一点，因为这是我试图掌握的问题。

saga 成功推送到商店（redux 开发工具显示新状态），但在发布新状态时组件不会重新渲染。

这里有什么线索吗？

myComponent.js

  const topBooks = useSelector(state => state.BOOKS[TOP_BOOKS]);
  const dispatch = useDispatch();

  if (!topBooks) {
    dispatch(fetchTopBooks(TOP_BOOKS));
  }

  return (
    <Shelf>
      <Books books={topBooks} />
    </Shelf>
  );
}

bookSaga.js

function* saveBooks() {
  while (true) {
    const { payload } = yield take(SAVE_BOOKS);

    yield put({
      type: SET_TOP_BOOKS,
      payload
    });
  }
}

bookReducer.js

const initialState = {};

const actionMap = {
  [SET_TOP_BOOKS](state, action) {
    return {
      TOP_BOOKS: action.payload
    };
  }
};

标签： react-reduxreact-hooksredux-sagarerender