reactjs - 类型错误：无法使用 react-redux 读取未定义 i 的属性“地图”

Question

我遵循 react-redux 教程并尝试显示帖子。我从https://jsonplaceholder.typicode.com/posts获取帖子数据。它返回这样的响应：

import React from 'react';
import { connect } from 'react-redux';
import { fetchPost } from '../actions'

class PostList extends React.Component{
    componentDidMount(){
        this.props.fetchPost();
    }
    renderList(){
        return this.props.post.map(pos => {
            return (
                <div className="item" key={pos.id}>
                    <p>{pos.title}</p>
                </div>
            );
        });
    }
    render(){
        return(<div className="ui relaxed divided list"> {this.renderList()} </div>);
    }
}
const mapStateToProps = (state) =>{
    return { post:state.post}
}
export default connect(mapStateToProps , { fetchPost })(PostList);

这是我的动作创建者

import JsonPlaceHolder from '../apis/JsonPlaceHolder'
export const fetchPost = () => {
    return async (dispatch) => {
        const response = await JsonPlaceHolder.get('/posts');
        dispatch({
            type: 'FETCH_POST',
            payload:response
        });
    }
};

这是我的减速机

export default (state=[],action) => {
    switch(action.type){
        case "FETCH_POST":
            return action.payload;
        default:
            return state;
    }
};

这是我的 ../apis/JsonPlaceHolder 文件

import axios from 'axios';

export default axios.create({
    baseURL:"https://jsonplaceholder.typicode.com/"
});

但我得到这样的错误

TypeError：this.props.post.map 不是函数

标签： reactjsreact-redux

Answer 1

您必须从中data提取response.

dispatch({
  type: 'FETCH_POST',
  payload:response.data
});