首页  >  问答  >  正文

当尝试使用获取的数据更新状态时,Console.log返回'undefined'

当我在渲染时或某些依赖项改变时获取数据时,它会正确地更新到Redux store中,但是当我使用console.log时,它会显示'undeifined'。

我正在开发预订系统,希望在指定的日期上获取已预订的小时数

/// 在组件渲染时获取数据并尝试使用console.log
     useEffect(() => {
    axios
      .get(
        `http://localhost/healthboyz/index.php/booked/${
          formData.doctor_id
        }/${moment(formData.date).format('YYYY-MM-DD')}`
      )
      .then((res) => setBookedHrs(res.data))
      .then(() => console.log(bookedHrs))
      .catch((e) => console.log(e));}, 
    [formData.doctor_id, formData.date]);
/// Hours reducer 
 const hoursReducerDefaultState: {
  bookedHrs: string[];
} = {
  bookedHrs: [],
};

export const hoursReducer = (
  state = hoursReducerDefaultState,
  action: {
    type: string;
    data: string[];
  }
) => {
  switch (action.type) {
    case 'SET_BOOKED_HRS':
      return [...action.data];
    default:
      return state;
  }
};
P粉925239921P粉925239921415 天前594

全部回复(1)我来回复

  • P粉211273535

    P粉2112735352023-09-22 00:41:54

    这里的问题实际上与Redux中如何设置状态有关:

    假设hoursReducer负责整个hoursReducerDefaultState,其代码如下:

    type HoursReducer = {
      bookedHrs: string[];
    };
    
     const hoursReducerDefaultState: HoursReducer = {
      bookedHrs: [],
    };
    

    然后,您需要设置Redux状态以更新您要更新的状态:

    export const hoursReducer = (
      state = hoursReducerDefaultState,
      action: {
        type: string;
        data: string[];
      }
    ) => {
      switch (action.type) {
        case 'SET_BOOKED_HRS':
          // 使用“spread”操作符包括先前的状态
          return {
            ...state,
            bookedHrs: action.data
          }
        default:
          return state;
      }
    };
    

    注意:我还假设您想完全替换bookedHrs的值。

    回复
    0
  • 取消回复