import { createAsyncThunk,createSlice } from "@reduxjs/toolkit"
import axios from "axios"
import apiHandler from "../../api/apiHandler"
const initialState = {
breakingNews:[],
general:[],
technology:[],
sports:[],
business:[],
status:'idle',
error:null
}
export const fetchBreakingNewsData = createAsyncThunk('news/breakingNews',apiHandler.getBreakingNewsData)
export const fetchGeneralNewsData = createAsyncThunk('news/generalNews',apiHandler.getCategoryNewsData('general'))
export const fetchTechnologyNewsData = createAsyncThunk('news/technologyNews',apiHandler.getCategoryNewsData('technology'))
export const fetchSportsNewsData = createAsyncThunk('news/sportsNews',apiHandler.getCategoryNewsData('sports'))
export const fetchBusinessNewsData = createAsyncThunk('news/businessNews',apiHandler.getCategoryNewsData('business'))
const newsSlice = createSlice({
name:'news',
initialState,
extraReducers(builder){
builder
.addCase(fetchBreakingNewsData.pending, (state, action) => {
state.status = 'loading'
})
.addCase(fetchBreakingNewsData.fulfilled, (state, action) => {
state.status = 'succeeded'
// Add any fetched posts to the array
state.breakingNews = state.breakingNews.concat(action.payload)
})
.addCase(fetchBreakingNewsData.rejected, (state, action) => {
state.status = 'failed'
state.error = action.error.message
})
.addCase(fetchGeneralNewsData.pending, (state, action) => {
state.status = 'loading'
})
.addCase(fetchGeneralNewsData.fulfilled, (state, action) => {
state.status = 'succeeded'
// Add any fetched posts to the array
state.general = state.general.concat(action.payload)
})
.addCase(fetchGeneralNewsData.rejected, (state, action) => {
state.status = 'failed'
state.error = action.error.message
})
.addCase(fetchTechnologyNewsData.pending, (state, action) => {
state.status = 'loading'
})
.addCase(fetchTechnologyNewsData.fulfilled, (state, action) => {
state.status = 'succeeded'
// Add any fetched posts to the array
state.technology = state.technology.concat(action.payload)
})
.addCase(fetchTechnologyNewsData.rejected, (state, action) => {
state.status = 'failed'
state.error = action.error.message
})
.addCase(fetchSportsNewsData.pending, (state, action) => {
state.status = 'loading'
})
.addCase(fetchSportsNewsData.fulfilled, (state, action) => {
state.status = 'succeeded'
// Add any fetched posts to the array
state.sports = state.sports.concat(action.payload)
})
.addCase(fetchSportsNewsData.rejected, (state, action) => {
state.status = 'failed'
state.error = action.error.message
})
.addCase(fetchBreakingNewsData.pending, (state, action) => {
state.status = 'loading'
})
.addCase(fetchBusinessNewsData.fulfilled, (state, action) => {
state.status = 'succeeded'
// Add any fetched posts to the array
state.business = state.business.concat(action.payload)
})
.addCase(fetchBusinessNewsData.rejected, (state, action) => {
state.status = 'failed'
state.error = action.error.message
})
}
})
export default newsSlice.reducer
字符串
请帮助我解决以下错误。如果在createSlice中无法使用多个API调用来添加case,那么我们如何使用redux工具包来完成呢?////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
3条答案
按热度按时间vc9ivgsu1#
我想换个方法看看对你是否有效。
将构建器与addCase分离。你能不能试着让我知道
字符串
5uzkadbs2#
我相信@lost_in_magento提到的是正确的。但是如果你仍然看到这个错误,你可以在构建器示例上创建每个addCase,而不是将它们链接在一起,如下所示:
字符串
i34xakig3#
你有fetchBreakingNewsData.挂起在那里两次。我假设你的意思是fetchBusinessNewsData.pending第二次。
字符串
'''上面的行在下面重复,请参阅代码中的中断。'''
型
'''上面一行是重复的,应该是:'''
型
“"”
型