Redux - 出现 404 错误且 state.category.push(action.payload) 不是函数错误

Redux -Having a 404 errror and state.category.push(action.payload) not a function error

我收到一个 400 客户端错误,并说 state.category.push 不是一个函数,当前状态是挂起。如果有人帮助我解决这个问题,我会很高兴。类别数组不接受进入其中的数据。我有表单文件和 reducer 文件。我正在尝试创建一个类别数组来接受用户类别,然后将其输出。

blogSlice.js 我的 Reducer 文件

const urlParams = new URLSearchParams(window.location.search)
const TokenAuthless = urlParams.get('enter')
if(TokenAuthless){localStorage.setItem('authless', 
JSON.stringify(TokenAuthless))}
var Token = JSON.parse(localStorage.getItem("authless"))

const initialState = {
    blogItems: [],
    isLoading: null,
    category: [{}],
    authors: [],
}

const categoryUrl = 'api/v1/admin/createBlogCat';
var api_origin = 'xxxxxxxxxxxx'

export const insertCategory = createAsyncThunk('blog/insertCategory', async(data, 
thunkAPI) => {
    const{ rejectWithValue } = thunkAPI;
    try {
        const res = await fetch(`${api_origin}/${categoryUrl}`,{
            method :'POST',
            mode: 'cors',
            body: JSON.stringify({data}),
            headers : {
                'Authorization': `Bearer ${Token}`,
                'Content-type':'application/json',
                'Accept':'application/json',
                'Access-Control-Allow-Origin':'*',
            },
        })
        const catData = await res.json();
        return catData.data;
    } catch (error) {
        return rejectWithValue(error.message)
    }
})

[insertCategory.pending]:(state, action) => {
     state.isLoading = true;
 },

    [insertCategory.fulfilled]: (state, action) => {
        state.isLoading = false;
        console.log(action.payload);
        console.log(current(state))
        state.category.push(action.payload);
        console.log('the state category', state.category);          
    },

    [insertCategory.rejected]:( state, action ) => {
        state.isLoading = false;
    },

CreateCategory.js 在此处创建一个表单以接受输入

const CreateCatAut = () => {
    const [name, setName] = useState('');
    const dispatch = useDispatch()

    const handleSubmit=(e)=>{
        e.preventDefault();
        const categoryData = {name}
        dispatch(insertCategory(categoryData));
        console.log(categoryData)
    }
    
    return (
        <form onSubmit={handleSubmit}>
            <input type="text" placeholder="Active Input" 
                   value={name}
                    onChange={(e)=> setName(e.target.value)} />   
    )

说明你的state.category不是数组。在

state.category.push(action.payload)

我为 state.category 分配了一个值,它还不是一个数组。首先创建一个数组,然后将该元素放入其中。

state.category= [action.payload]

在下一次迭代中,我将拥有一个包含一个元素的数组,并且可以对其使用推送。