简单循环输出人名

循环输出people数组中的四个人名

import ReactDOM from 'react-dom/client';const people = ['宋江','卢俊义','吴用','公孙胜'
];
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<List />
);function List() {const listItems = people.map(person =><li>{person}</li>);return <ul>{listItems}</ul>;
}

显示效果：

---

简单循环输出json格式数组

循环输出people数组中的四个键值对人名

import ReactDOM from 'react-dom/client';const people = [{id: 1,name: '宋江',nickName: '呼保义'},{id: 2,name: '卢俊义',nickName: '玉麒麟'},{id: 3,name: '吴用',nickName: '智多星'},{id:4,name: '公孙胜',nickName: '入云龙'}
];const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<List />
);function List() {const listItems = people.map(person =><li>花名：{person.nickName} 真名： {person.name} </li>);return <ul>{listItems}</ul>;
}

显示效果：