![](/img/trans.png)
[英]How to map over 2 arrays simultaneously and update the arrays according to condition in reactjs
[英]How to map over arrays of arrays in JSX
我有一个名称列表作为数组。 然后将这些名称配对到我的 App.js 中的一个数组中
我正在寻找映射这些以创建一个<ul> containing <li>
的<ul> containing <li>
并且我被卡住了,任何帮助都会很棒,谢谢!
不幸的是,像这样的数组上的常规映射不起作用......谢谢!
return (
<ul>
{pairs.map(pair => (
<li key={pair}>{pair}</li>
))}
</ul>
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> createPairs() { const list = [...this.state.list]; list.sort(() => 0.5 - Math.random()); const pairs = []; while (list.length >= 2) { const pair = [list.pop(), list.pop()]; pairs.push(pair); } this.setState({ pairs }); }
您可以潜在地在map
参数中使用解构来提取每对的组件。 请记住将解构的参数括在括号中。
return (
<ul>
{pairs.map(([pair_1, pair_2]) => (
<li key={pair_1}>{pair_1}</li>
))}
</ul>
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.