карта функций в реакции

Question

Я новичок ie в реакции, и у меня следующая проблема: я пытаюсь получить объекты из get (топор ios) и играть на экране, используя карту, но я делаю это неправильно, если кто-то может мне помочь, я был бы благодарен.

заявка принесла мне следующие предметы:

0: {username: "eqwe", name: "weqeqw", email : "eqwwqe", город: "qweewq", id: "fxm8j"}

1: {username: "sadsa", имя: "asdads", электронная почта: "asdas", город: "sddsadsa", id: "79ywn"}

2: {имя пользователя: "aaa", имя: "aaa", электронная почта: "aaaa", город: "aaaaa", id: "8shpw"}

3: {username: "ddd", имя: "ddd", электронная почта: "d ddd", город: "ddd", id: "aourz"}

4 : {имя пользователя: "teste", имя: "teste", электронная почта: "teste", адрес: {…}, город: "teste",…} ...

это мой код:

import {getUsers} from '../actions';


function Table(){

const [data, setData] = useState({data: []});

useEffect(() => {
    async function fetchData(){
        const result = await getUsers();
        setData(result);
        console.log("teste: ", result);
    }
    fetchData();
}, []);
return(
     {data.map((item) => 
     <div key={item.id}>{item.name}</div>)}
)

Answer 1

Вам не нужно переводить вложенный объект в состояние.

import {getUsers} from '../actions';
function Table(){

const [data, setData] = useState([]);

useEffect(() => {
    async function fetchData(){
        const result = await getUsers();
        setData(result);
        console.log("teste: ", result);
    }
    fetchData();
}, []);
return(
     {data.map((item) => 
     <div key={item.id}>{item.name}</div>)}
)

Answer 2

Просто поместите { ... }:

return data.map(item => (
   <div key={item.id}>{item.name}</div>
));

{ } внутри компонента, чтобы вставить результат выражения. Однако вы не находитесь внутри элемента (не внутри <tag> ... </tag>), поэтому { } будет обозначать только блок кода.