Question

我可以将两个动作连接到一个减速器吗？我想做的是获取一个对象（将具有相同的属性类型）通过两个不同的动作，然后将其添加到状态中，我希望它像这样：如果我调用动作1，则状态应为动作1的结果，如果我随后调用动作2，则该状态下的动作1的结果应被动作2的结果覆盖。因此，我想使用连接到一个减速器的两个动作。因此他们在商店（州）使用相同的属性。

第一个动作

export function projectHasErrored(bool){
    return {
        type: 'PROJECT_HAS_ERRORED',
        hasErrored: bool
    };
}

export function projectIsLoading(bool){
    return {
        type: 'PROJECT_IS_LOADING',
        isLoading: bool
    };
}

export function projectFetchDataSuccess(project){
    console.log(project)
    return {
        type: 'PROJECT_FETCH_SUCCESS',
        project
    };
}

export function projectFetchData(url, {owner, projectName}){
    console.log(projectName + "! hejhej")
    return (dispatch) => {
        dispatch(projectIsLoading(true));

        fetch(url,{
            method: 'POST',
            data: {
                owner,
                projectName
            }
            })
            .then((response) => {
                if(!response.ok){
                    throw Error(response.statusText)
                }

                dispatch(projectIsLoading(false));

                return response;
            })
            .then((response) => response.json())
            .then((project) => dispatch(projectFetchDataSuccess(project)))
            .catch(() => dispatch(projectHasErrored(true)));
    };
}

第二项操作

export function lastProjectHasErrored(bool){
    return {
        type: 'PROJECT_HAS_ERRORED',
        hasErrored: bool
    };
}

export function lastProjectIsLoading(bool){
    return {
        type: 'PROJECT_IS_LOADING',
        isLoading: bool
    };
}

export function projectFetchDataSuccess(project){
    console.log(project)
    return {
        type: 'PROJECT_FETCH_SUCCESS',
        project
    };
}

export function lastProjectFetchData(url, owner){
    return (dispatch) => {
        dispatch(lastProjectIsLoading(true));
        fetch(url,{
            method: 'POST',
            data: {
                owner
            }
            })
            .then((response) => {
                if(!response.ok){
                    throw Error(response.statusText)
                }

                dispatch(lastProjectIsLoading(false));

                return response;
            })
            .then((response) => response.json())
            .then((project) => dispatch(lastProjectFetchDataSuccess(project)))
            .catch(() => dispatch(lastProjectHasErrored(true)));
    };
}

减速机

export function projectHasErrored(state = false, action){
    switch(action.type){
      case 'PROJECT_HAS_ERRORED':
        return action.hasErrored;

      default:
        return state
    }
}

export function projectIsLoading(state = false, action){
  switch(action.type){
    case 'PROJECT_IS_LOADING':
      return action.isLoading;

    default:
      return state
  }
}

export function project(state = [], action){
  switch(action.type){
    case 'PROJECT_FETCH_SUCCESS':
      return action.project;

    default:
      return state
  }
}

Answer 1

您可以将一个或多个动作连接到减速器。

// action1.js

 `export function Add(data){
      return (dispatch)=>{
          dispatch(type:'SET_DATA',data})   
      } 
  }`

// action2.js

`export function Sub(value){
     return (dispatch)=>{
         dispatch({type:'SET_VALUE',value})
     }
 }

现在在reducer.js中

const initialState={
  data:''
  value:''
}
export default function initialReducer(state=initialState,action){
    switch(action.type){
        case 'SET_DATA':{
         return {
              ...state,
              data:action.data
         }
         }
         case 'SET_VALUE':{
         return {
              ...state,
              data:action.value
         }
         }
         default: {return state}
    }
}

因此，这些动作将连接到相同的reducer。

将两个动作连接到一个减速器？

1 个答案: