使用.map()打印reactjs中每两个一组的值
使用.map()打印reactjs中每两个一组的值
提问于 2021-04-13 20:40:54
我正在尝试呈现一个将在一行中打印两个to值的<li>。然后第三个在下一个<li>中赋值。所以我的对象是这样的。
let obj = [
{from : 'a1' , to : 'a7'},
{from : 'b1' , to : 'b7',
{from : 'c4' , to : 'c27'},
{from : 'a1' , to : 'a9'},
{from : 'j1' , to : 'a10'}
]我想像这样输出它
1. a7 , b7
2. c27, a9
3. a10The obj是一种react状态。我正在使用js中的.map()函数打印它。但我想把它打印成两张一张。我如何才能做到这一点。
moves.map((move, i) => {
return (
<li key={i}>{i}
{move}
</li>
)
})回答 2
Stack Overflow用户
发布于 2021-04-13 20:53:19
首先，您必须按比例迭代您的obj变量。
const moves = [];
for (let i = 0; i < obj.length; i += 2) {
let move = obj[i].to;
if (i + 1 < obj.length) {
move += ", " + obj[i + 1].to;
}
moves.push(move);
}然后，您可以简单地迭代新创建的moves变量。
{moves.map((move, i) => {
return (
<p key={i}>
{i + 1}. {move}
</p>
);
})}注意：你可以使用li而不是p标签。
结果：
CodeSandbox上的工作演示。
Stack Overflow用户
发布于 2021-04-13 20:53:58
应该能够做一些类似的事情：
moves.map((move, i) => {
return (
<li key={i}>{i}
{`move[i].to` + move[i+1] ? `, move[i+1].to` :''}
</li>
)
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67075077
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号