如何在调用 API 服务器时从 redux 中的 axios 响应中的 object 中删除某些属性
How to delete certain properties from an object in an axios response in redux while calling an API server
我正在从我的 redux 项目中调用一个 API 服务器,我想在其中提取 API 中的 data.The 数据,格式如下所示:
const defaultData = {
categories: [
{
name: 'react',
path: 'react'
},
{
name: 'redux',
path: 'redux'
},
{
name: 'udacity',
path: 'udacity'
}
]
}
因此,在我的 redux "Actions" 中,我正在使用 axios 制作 API call.The 操作文件,如下所示:
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
})
})
}
}
我正在尝试将 API 调用的结果保存在我的 reducer.The 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() 来组合我的索引文件中的所有 reducer,如下所示:
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 类别状态的值时,我得到如下图所示的内容:
但我只想要类别 属性,其中我获得了三个类别(我想省略配置,headers,请求属性)。
我什至尝试过类似的方法: console.log(this.props.categories.data.categories) ,但这给了我一个未定义的值。
谁能帮我解决这个问题?
那是因为这条线{categories: {...state.categories, ...action.payload}};
将其更改为 {categories: [...state.categories, ...action.payload.data.categories]};
我正在从我的 redux 项目中调用一个 API 服务器,我想在其中提取 API 中的 data.The 数据,格式如下所示:
const defaultData = {
categories: [
{
name: 'react',
path: 'react'
},
{
name: 'redux',
path: 'redux'
},
{
name: 'udacity',
path: 'udacity'
}
]
}
因此,在我的 redux "Actions" 中,我正在使用 axios 制作 API call.The 操作文件,如下所示:
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
})
})
}
}
我正在尝试将 API 调用的结果保存在我的 reducer.The 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() 来组合我的索引文件中的所有 reducer,如下所示:
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 类别状态的值时,我得到如下图所示的内容:
但我只想要类别 属性,其中我获得了三个类别(我想省略配置,headers,请求属性)。 我什至尝试过类似的方法: console.log(this.props.categories.data.categories) ,但这给了我一个未定义的值。 谁能帮我解决这个问题?
那是因为这条线{categories: {...state.categories, ...action.payload}};
将其更改为 {categories: [...state.categories, ...action.payload.data.categories]};