0

I tried this but did not help me. this is my slice:

export const getAll = () => {
    return axios.get('http://localhost:4000/students').then(response => {
        return response.data
    })
}

export const retriveStudents = createAsyncThunk(
    "students/retrive", async () => {
        return await getAll()
    }
)

const studentSlice = createSlice({
    name: "student",
    initialState,
    reducers: {
        addNote: (state, action) => {
            return { ...state, note: action.payload }
        }
    },
    extraReducers: {
        [retriveStudents.fulfilled]: (state, action) => {
            studentSlice.actions.addNote("MY DATA...")
            return { ...state, items: [...action.payload] }
        }
    }
})

In extraReducers I want to dispatch addNote action. I tried the following, but does not work.

extraReducers: {
    [retriveStudents.fulfilled]: (state, action) => {
        studentSlice.actions.addNote("MY DATA...") // this. line ...
        return { ...state, items: [...action.payload] }
    }
}
AR Second
  • 582
  • 1
  • 6
  • 25
  • 1
    You can't dispatch actions in reducers. If you want something to happen after `retriveStudents.fulfilled` (it's spelled `retrieve` with "ie" btw), the right place is in the function you pass to `createAsyncThunk`. – timotgl Jan 30 '23 at 16:50
  • @timotgl - thanks my friend, I tried it and it worked. – AR Second Jan 30 '23 at 16:56

0 Answers0