等待在 redux 中无法使用 useEffect

Question

我正在尝试从 API 获取一些数据并在我的 redux 存储中设置数据。但是，当我尝试对 redux 存储中的数据进行一些操作时，该变量为空。我用过 await 但它似乎不起作用。但是，在 useEffect 之后，redux store(api data) 数据是可见的并且可以对其进行操作。任何帮助表示赞赏。 请注意，我需要访问 redux 存储字段，而不仅仅是从函数中获取返回的数据。访问 redux 存储字段很重要。这是我的代码：

useEffect(() => {
    async function loadData() {
      const startingDateYear = moment();
      const eventDates = generateDatesForYear(startingDateYear.year().toString());
      await dispatch(fetchData('0009', eventDates[0], eventDates[1]));
    }
    loadData();
    console.log(event.myDataArray) // event is a reducer and myDataArray is the field. It can be accessed outside the function with data incorporated but within useEffect I am not able to use the freshly fetched data.
    return {};
  }, []);


 export const fetchData = (p1, p2, p3) => {
  return async dispatch => {
    const path = `dataFromAPIURL`;
    try {
      dispatch({
        type: FETCH_STARTED,
      });

      const myDataArray = await RestService.get(path);
      dispatch({
        type: FETCH_FINISHED,
      });

      dispatch({
        type: UPDATE_REDUCER_STATE,
        payload: myDataArray,
      });

      return myDataArray;
    } catch (error) {
      // TODO: error handling
      dispatch({ type: FETCH_ERROR, payload: error });
    }
  };
};

Answer 1

你需要第二个 useEffect 依赖 event.myDataArray

useEffect(() => {
  async function loadData() {
    const startingDateYear = moment();
    const eventDates = generateDatesForYear(startingDateYear.year().toString());
    await dispatch(fetchData("0009", eventDates[0], eventDates[1]));
  }
  loadData();
}, []);

useEffect(() => {
  console.log(event.myDataArray);
}, [event.myDataArray]);