无法显示从服务器发送的json数据 [英] not able to display json data sent from server

问题描述

我正在从服务器接收数据作为json数据，但无法在浏览器中显示它，但出现错误

I am receiving data from server as json data but not a able to display it on the browser i am getting error as

对象作为React子对象无效(找到:带键的对象 {_id，ID，名称，年龄}).如果您打算呈现一个 子代，请改用数组或使用来包装对象 React插件中的createFragment(object).检查渲染方法 在学生中"

" Objects are not valid as a React child (found: object with keys {_id, Id, Name, Age}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method in student"

import React from 'react';
import axios from 'axios';

class Student extends React.Component{
  constructor(props){
    super(props);
    this.state={
      post:[]
    }
  };


componentDidMount(){
  axios.get('http://localhost:8080/student')
  .then(data => this.setState({post:data}));
    }


  render(){
    return(
<div className="pre">

<h1>{this.state.post.data}</h1>
</div>
    );
  }
}
export default Student;

推荐答案

该错误表明this.state.post.data是一个对象，因此需要在渲染之前将其转换为字符串.使用JSON.stringify()

The error suggests that this.state.post.data is an object and hence you need to convert it to a string before rendering. Use JSON.stringify()

尝试

class Student extends React.Component{
  constructor(props){
    super(props);
    this.state={
      post:[]
    }
  };


componentDidMount(){
  axios.get('http://localhost:8080/student')
  .then(data => this.setState({post:data}));
    }


  render(){
    return(
<div className="pre">

<h1>{JSON.stringify(this.state.post.data)}</h1>
</div>
    );
  }
}

这篇关于无法显示从服务器发送的json数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！