Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/462.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 是否有必要在Redux工具箱中定义我们自己的动作创建者?_Javascript_Reactjs_Redux_Frontend_Redux Toolkit - Fatal编程技术网

Javascript 是否有必要在Redux工具箱中定义我们自己的动作创建者?

Javascript 是否有必要在Redux工具箱中定义我们自己的动作创建者?,javascript,reactjs,redux,frontend,redux-toolkit,Javascript,Reactjs,Redux,Frontend,Redux Toolkit,因此,我试图找出在我的react项目中使用redux工具包的最佳方法。这是我目前在redux toolkit中编写一个典型切片的方法,同时使用redux thunk进行API调用 import { createSlice } from "@reduxjs/toolkit"; import axios from "axios"; import { baseUrl } from "../../../baseUrl"; const searc

因此,我试图找出在我的react项目中使用redux工具包的最佳方法。这是我目前在redux toolkit中编写一个典型切片的方法,同时使用redux thunk进行API调用

import { createSlice } from "@reduxjs/toolkit";
import axios from "axios";
import { baseUrl } from "../../../baseUrl";
const searchTrip = createSlice({
    name: "searchTrip",
    initialState: {
        isLoading: false,
        data: null,
        success: false,
    },
    reducers: {
        sendRequest: (state, action) => ({
            ...state,
            isLoading: true,
        }),
        sendSuccess: (state, action) => ({
            ...state,
            isLoading: false,
            errMess: null,
            data: action.data,
            success: true,
        }),
        sendFailed: (state, action) => ({
            ...state,
            isLoading: false,
            errMess: action.message,
            success: false,
        }),
    },
});
export const { sendFailed, sendRequest, sendSuccess } = searchTrip.actions;
//行动创造者:

export const requestSend = () => {
    return {
        type: sendRequest.type,
    };
};

export const receiveSend = (response) => {
    return {
        type: sendSuccess.type,
        data: response,
    };
};

export const sendError = (message) => {
    return {
        type: sendFailed.type,
        message,
    };
};
//redux thunk进行API调用

 export const postSearchTrip = (data) => (dispatch) => {
        dispatch(requestSend());
        const call = {
            url: baseUrl + "trips/search",
            method: "POST",
            headers: {
                "Content-Type": "application/json",
                Authorization: "Bearer " + localStorage.getItem("token"),
            },
            data: {
                search: data,
            },
        };
        return axios(call)
            .then((response) => {
                dispatch(receiveSend(response.data));
            })
            .catch((error) => {
                dispatch(sendError(error.message));
                alert(error);
            });
    };
    export default searchTrip.reducer;
现在,我觉得每个片段都会重复动作创建者部分,有没有办法不使用它。我可以直接使用sendSuccess、sendRequest等吗


另外,两个切片的异径管可以有相同的名称吗?与常规API调用一样,我将我的还原程序命名为sendRequest、sendSuccess和sendFaliure,并在所有切片上复制粘贴此部分。这会产生任何问题吗?

不,
createSlice
的要点是它会自动为您生成动作创建者-您自己不会(也不应该)编写动作创建者

当您编写自己的
requestSend()
函数时,您只是在复制
createSlice
已经为您做过的事情。你可以完全停止这样做:)

此外,请注意:

  • Redux Toolkit已经提供了一种简化异步请求和调度操作过程的工具
  • 我们即将发布一个新的版本,它将完全抽象数据获取过程——不需要编写任何thunk或reducer来获取数据

谢谢,在此之前我写了很多毫无意义的代码:(