我没有使用 JSX。这是个问题吗?这被认为是不好的做法吗?
var links = [
{ endpoint: '/america' },
{ endpoint: '/canada' },
{ endpoint: '/norway' },
{ endpoint: '/bahamas' }
];
class Navigation extends React.Component {
render() {
return (
<div className="navigation">
<ul>
const listItems = links.map((link) =>
<li key={link.endpoint}>{link.endpoint}</li>
);
</ul>
</div>
);
}
根据 react 文档的基本列表组件部分,似乎我应该能够打印数组的内容,就像我在 <ul></ul>
中所做的那样
https://facebook.github.io/react/docs/lists-and-keys.html#basic-list-component
问题是我使用的是对象数组吗?文档使用的是一个简单的数组。如果能插入正确的方向,我将不胜感激。
最佳答案
问题是你的语法无效,你应该有这样的东西:
var links = [
{ endpoint: '/america' },
{ endpoint: '/canada' },
{ endpoint: '/norway' },
{ endpoint: '/bahamas' }
];
class Navigation extends React.Component {
render() {
const listItems = links.map((link) =>
<li key={link.endpoint}>{link.endpoint}</li>
);
return (
<div className="navigation">
<ul>
{listItems}
</ul>
</div>
);
}
关于javascript - 在 React 中循环遍历简单的对象数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45857698/