Object.keys不会在react中呈现我的视图

Question

我正在尝试通过内部数组渲染视图Object.keys(data).map((section, i)我放了console.log ();，他们显示了应该显示的信息，但没有任何内容。我在做什么错？

 let data={
    "trucker": {
        "section": "camionero"
    },
    "client": {
        "section": "cliente"
    }
}
const [data, setData] = useState(data);

                        return (<List>
                            {
                                Object.keys(data).map((section, i) => {
                                    console.log("*", section, " ", data[section].section);
                                    /* result of console.log()
                                     * trucker   camionero
                                     * client   cliente
                                     * container   contenedor
                                    */
                                    return
                                    <ListItem itemHeader first key={i}>
                                        <Text>{data[section].section}</Text>
                                    </ListItem>
                                })
                            }

                        </List>)

Answer 1

return
<ListItem itemHeader first key={i}>
  <Text>{data[section].section}</Text>
</ListItem>

return关键字不能单独显示。 JS将其解释为自己的独立语句，并返回undefined而不是下一行的值。

添加一些括号以强制其返回您的JSX。

return (
  <ListItem itemHeader first key={i}>
    <Text>{data[section].section}</Text>
  </ListItem>
)

Further relevant reading