javascript - Javascript 不返回 html 元素

Question

一直在尝试为自己做一些项目来练习反应，因为我是新手，而且我遇到了麻烦，无论如何，在 map 中使用 map 后，它都不会从 javascript 返回 html

import './App.css';
import data from './data.json';
import React from 'react';

function App() {
  const keys = Object.keys(data)
  return (
    <div className="App">
      <header className="App-header">
         {keys.map(key => {
           if (key !== "events"){
               return (<h1 className="data">{key} : {data[key]}</h1>);
           }else{
             data["events"].map(event => {
               return (<h1 className="event_data"> {event["name"]} value was changed to {event["state"]} in {event["date"]} </h1>);
             })
           }
         })
        }
      </header>
    </div>
  );
}

export default App;

有什么原因使它不起作用吗？我该如何解决？

标签： javascriptreactjs

Answer 1

这个分支：

           }else{
             data["events"].map(event => {
               return (<h1 className="event_data"> {event["name"]} value was changed to {event["state"]} in {event["date"]} </h1>);
             })
           }

不返回元素。你需要return data['events'].map...