不确定如何在 React 应用程序中显示后端数据

Question

我的后端服务器中有如下数据-

我想将此数据显示为前端。
我是按照以下方式做的-

import {useState, useEffect} from 'react';
import logo from './logo.svg';
import './App.css';

function App() {
  const [data,setData] = useState([])
  useEffect( () => {
    fetch("http://127.0.0.1:5000/lang")
    .then(res =>  res.json())
    .then( res => {setData(res)} )
    console.log('datas')
    console.log(data)
  }, [] )
  return (
    <div className="App">
        {
        data.map((data,i) => {
        <h1>
          Edit {data.name} and save to reload.
        </h1>
      })
    }
    </div>
  );
}

export default App;

此数据正在后台通过控制台登录，但不会显示在前端应用程序中。

后台数据怎么显示在这里？

Answer 1

您需要 return 元素

 data.map((data,i) => {
   return (
    <h1>
      Edit {data.name} and save to reload.
    </h1>
   )
 })

或使用括号

data.map((data,i) => (
  <h1>
    Edit {data.name} and save to reload.
  </h1>
));

不确定如何在 React 应用程序中显示后端数据

Not sure how to display backend data in react app

json

backend

reactjs