Javascript 在react redux应用程序中显示来自reddit api的响应

Javascript 在react redux应用程序中显示来自reddit api的响应,javascript,ajax,reactjs,redux,Javascript,Ajax,Reactjs,Redux,我正在从react redux应用程序调用reddit api。响应来自reddit,包含所有数据。它返回25个帖子,其中我只能在前端显示一个。我相信这是因为它是一个嵌套数组 有人能看到我做错了什么吗 返回的响应已经是一个数组。在reducer中,当您执行state.concat[action.data]时,它返回一个嵌套数组[array[25]] 使用state.concataction.data,然后将您的var列表替换为this.props.data.mapfunctionitem,i{r

我正在从react redux应用程序调用reddit api。响应来自reddit,包含所有数据。它返回25个帖子,其中我只能在前端显示一个。我相信这是因为它是一个嵌套数组

有人能看到我做错了什么吗

返回的响应已经是一个数组。在reducer中,当您执行state.concat[action.data]时,它返回一个嵌套数组[array[25]]

使用state.concataction.data,然后将您的var列表替换为this.props.data.mapfunctionitem,i{return{item.data.title}

import React from 'react';
import ReactDOM from 'react-dom';
import { createStore, combineReducers } from 'redux';
import { connect, Provider } from 'react-redux';
import axios from 'axios';


function addData(state = [], action) {
    switch(action.type) {
        case 'ADD_DATA':
            var newState = state.concat([action.data]);
            return newState
        default:
            return state;
    }
    return state;
}

const store = createStore(addData);

class App extends React.Component {

    componentDidMount() {
        axios.get('https://www.reddit.com/r/reactjs/.json').then(response => {
            var response = response.data.data.children;
            store.dispatch({
                type: 'ADD_DATA',
                data: response
            });
            console.log('Response Returned Now');
        })      
    }

    render() {
        var list = this.props.data.map(function(item, i){
            return (<li key={i}>{item[i].data.title}</li>)
        })
        return (
            <ul>
                {list}
            </ul>
        )
    }
}

const mapStateToProps = function(store){
    return {
        data: store
    }
}

const ConnectedApp = connect(mapStateToProps)(App);
ReactDOM.render(
  <Provider store={store}>
    <ConnectedApp />
  </Provider>
    , document.getElementById('app')
);