如何访问使用 axios 加载的对象属性？

Question

我正在制作一个网站，用于存储 JSON 文件中的变量，然后我可以显示该数据。我试图从一个对象中提取数据，但我总是得到未定义或空的 arrays/objects.

这是我的父组件的内容。

export default class App extends Component {
    constructor(){
        super();
        this.state = {
            arrival: {}
        }
    }

    axiosFunc = () => {
        axios.get('https://api.warframestat.us/pc').then(results => {
            this.setState({
                arrival: results.data.voidTrader.activation,
            });
            setTimeout(this.axiosFunc,1000 * 60);
        })
    }

    componentDidMount() {
        this.axiosFunc();
    }
}

接下来，在子组件中，我使用props来存储到达数据。

<Baro arrival={this.state.arrival}/>

但是，当我切换到子组件的文件来显示数据时，我得到一个空对象...

componentDidMount(){
    console.log(this.props.arrival)
}

如何让数据显示正确？

Answer 1

您的子组件可能在 GET 请求解析之前就已安装。您显示的控制台日志在 componentDidMount 中。尝试从 componentWillReceiveProps 或 componentDidUpdate 控制台记录它，看看数据是否稍后到达那里。

或者，安装优秀的 React Dev Tools Chrome 扩展并实时观察组件的道具。

如何访问使用 axios 加载的对象属性？

How can I access the object properties loaded with axios?

javascript

reactjs

axios