时间戳

首页 > 解决方案 > 页面加载时，调度未在 useEffect 内触发

reactjs - 页面加载时，调度未在 useEffect 内触发

问题描述

我试图在页面加载时在 useEffect 中启动调度操作，以便检索 JSON 并填充对象。

如果通过另一个调用单独调用调度函数，则可以正常工作，并且 useEffect 还处理其他逻辑，但是当这两者结合时，调度操作不会从内部触发。我还编写了一个回调函数，并尝试从 useEffect 中调用它，但没有任何运气。对于任何反馈，我们都表示感谢。


const dispatch = useDispatch();

useEffect(() => {
  dispatch(actions.loadCountries);
}, [dispatch]);

---------------------------
Using redux toolkit and create slice

export const initialState: ContainerState = {
  countriesLoading: false,
  countriesError: null,
  countries: [],
};

const initiateSlice = createSlice({
  name: 'home',
  initialState,
  reducers: {
    loadCountries(state) {
      state.countriesLoading = true;
      state.countriesError = null;
      state.countries = [];
    },
    countriesLoaded(state, action: PayloadAction<ICountry[]>) {
      state.countries = action.payload;
      state.countriesLoading = false;
    },
    countriesError(state, action: PayloadAction<ErrorType>) {
      state.countriesError = action.payload;
      state.countriesLoading = false;
    },
  },
});

export const { actions, reducer, name: sliceKey } = initiateSlice;


--------------
Selector

const selectDomain = (state: RootState) => state.initiate || initialState;

export const selectCountriesLoading = createSelector(
  [selectDomain],
  initiateState => initiateState.countriesLoading,
);

export const selectCountriesError = createSelector(
  [selectDomain],
  initiateState => initiateState.countriesError,
);

export const selectCountries = createSelector(
  [selectDomain],
  initiateState => initiateState.countries,
);

标签： reactjsreduxreact-hooks

解决方案

嗯...尝试将（）添加到动作名称的末尾

调度（actions.loadCountries**（）**）

推荐阅读