When I get the data on render or when some dependencies change, it updates to the Redux store correctly, but when I console.log it says 'undefined'.
I am developing a booking system and want to get the number of hours booked on a specified date
/// 在组件渲染时获取数据并尝试使用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;
}
}; 
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
The question here actually has to do with how state is set in Redux:
Assume that
hoursReduceris responsible for the entirehoursReducerDefaultState, its code is as follows:type HoursReducer = { bookedHrs: string[]; }; const hoursReducerDefaultState: HoursReducer = { bookedHrs: [], };Then you need to set the Redux state to the state you want to update:
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; } };Note: I'm also assuming you want to completely replace the value of
bookedHrs.