在Promise.all反应中获取错误

时间:2018-09-26 00:57:18

标签: javascript reactjs axios es6-promise

我一直在使用axios.get进行api请求,但是我正在测试如何在componentDidMount上提取多个api请求。我一直在查找并使用其他人的代码,因此确定Promise.all是可行的方法。我绝对可能是错的,并且不介意回到axios。使用axios.spread方法会引发错误,而Promise.all也会引发相同的错误。关于为什么这行不通的想法吗?

import React from "react";
import ReactDOM from "react-dom";
import axios from 'axios'
import { Table } from './Table'

export class DataList extends React.Component {

    state = {
        articles: [],
        google: []
    }
    componentDidMount() {
        Promise.all([
            ('http://127.0.0.1:8000/api/portblog/'),
            ('http://www.google.com')
        ])
        .then(([res, googleRes]) => {
            this.setState({
                articles: res.data,
                google: googleRes
            })
            console.log(res.data)
        })
    }
    render() {
        return(

            <div>
            <Table key={this.state.articles.id} 
                   articles={this.state.articles} />
            </div>
        )
    }
}
export default DataList

编辑:错误:

DataList.js?a7e0:29 Uncaught TypeError: Cannot read property 'id' of undefined

1 个答案:

答案 0 :(得分:2)

尝试一下。我看不到您向这些URL发送Ajax请求。

    Promise.all([
        axios.get('http://127.0.0.1:8000/api/portblog/'),
        axios.get('http://www.google.com')
    ])