如何在调用API服务器时从redux中的axios响应中的对象中删除某些属性

Question

我从我的redux项目中调用API服务器，我想在其中提取数据.API中的数据格式如下所示：

const defaultData = {
  categories: [
      {
        name: 'react',
        path: 'react'
      },
      {
        name: 'redux',
        path: 'redux'
      },
      {
        name: 'udacity',
        path: 'udacity'
      }
  ]
}

所以，在我的redux“Actions”中，我使用axios来进行API调用。动作文件如下：

import axios from 'axios';
export const FETCH_CATEGORIES = 'fetch_categories';

let token;
if (!token)
  token = localStorage.token = Math.random().toString(32).substr(-8);
const API = 'http://localhost:3001';
const headers = {
                  'Accept' : 'application/json',
                  'Authorization' : 'token'
}

export function fetchCategories() {
  const URL = `${API}/categories`;
  const request = axios.get(URL,{headers});

  return dispatch => {
        return request.then((data) => {
          dispatch({
            type : FETCH_CATEGORIES,
            payload : data
          })
        })
  }
}

我试图在我的reducer中的应用程序状态中保存API调用的结果。类别的Reducer如下所示：

import _ from 'lodash';
import { FETCH_CATEGORIES } from '../actions/categories_action';

export default function(state={}, action) {
    switch(action.type) {
      case FETCH_CATEGORIES:
        return {categories: {...state.categories, ...action.payload}};

        default:
          return state;
    }
}

我正在使用combineReducers（）来组合我的索引文件中的所有reducers，如下所示：

import { combineReducers } from 'redux';
import PostReducer from './PostsReducer';
import CategoriesReducer from './CategoriesReducer';

const rootReducer = combineReducers({
    loading: false,
    posts: PostReducer,
    categories: CategoriesReducer
});

export default rootReducer;

然后，在我的组件中，我试图显示来自州的数据。所以，当我尝试console.log类别状态的值时，我会得到类似这样的内容，如下图所示：

但我只想要categories属性，我得到三个类别（我想省略配置，标题，请求属性）。我甚至尝试过类似：console.log（this.props.categories.data.categories），但这给了我一个未定义的值。有人可以帮我这个吗？

Answer 1

那是因为这条线{categories: {...state.categories, ...action.payload}};

改为{categories: [...state.categories, ...action.payload.data.categories]};