unable to display the data in react but able to see in the console

*****My code *****

export default class App extends Component {


  

  state = {
    arraydata: []   };


  componentDidMount = () => {
    this.getmongodbdata();   }

  getmongodbdata = () => {
    axios.get('http://localhost:8080/fetch').then(res => {
      console.log(res.data,)
      console.log('Data is recieved')
      this.setState({arraydata: res.data})
      
    })
      .catch(() => {
        alert('Sorry, could not able to fetch the data');
      })   }
  


     render() {
    return (
      <div className="Main">
       <header className="App-header">
          
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to Future</h1>
       </header> 


       <h1> hello world</h1>

        <ul key={'qw'}>
          {this.state.arraydata.map((data) => {
            <li key={'ui'}>
              {data._id}
            </li>
            console.log(data._id)
          })}
        </ul>

        


      <div className={"blog-"}>
      
      
      
      </div>
      </div>
    )   } }

*My output in console and react to

enter image description here

Just trying to display this data but unable to.

27 thoughts on “unable to display the data in react but able to see in the console”

  1. 954415 7223Hiya! Fantastic weblog! I happen to be a every day visitor to your site (somewhat much more like addict ) of this site. Just wanted to say I appreciate your blogs and am seeking forward for much more to come! 275370

    Reply

Leave a Comment