热门标签
当前位置: jquery > 正文
如何使用JSX重复一次元素n次
作者：数据可视化灵魂 | 2023-03-09 19:06:57
赞
踩
javascript,lodash,react-jsx,typescript,https,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix时间戳,在线开发工具,前端开发工具,开发人员工具,站长工具
我在我的应用程序中使用React/JSX以实现我想要的,Lodash.
我需要根据条件重复一个元素一定次数,我该怎么做？
这是元素:
?;
我这样分配它:
let card;
if (data.hand === '8 or more cards') {
card = ?;
}
所以在这种情况下,我需要重复8次元素.使用Lodash的过程应该是什么？
1> Waiski..：
没有任何外部库的最短方法:
const n = 8; // Or something else
[...Array(n)].map((e, i) => ?)
非lodash用户的真棒答案!值得指出它确实需要ES6功能(尽管我认为无论如何在问题中使用'let`意味着它).
对于那些使用Typescript 2+的人来说,这将编译成`Array(3).slice().map(...)`,它们没有达到相同的效果.请参阅@ Jian的答案作为替代.
@KevinWang，因为您的建议将创建一个长度为8的“空”数组，而不是由8个未定义项组成的数组。迭代不适用于前者。在控制台中将其卡住以查看区别。
2> Jian Weihang..：
没有lodash或ES6传播语法的解决方案:
Array.apply(null, { length: 10 }).map((e, i) => (
?
));
3> Long Nguyen..：
干得好:
let card = [];
_.times(8, () => {
card.push(?);
});
您可能希望为每个span元素添加键,以便React不会抱怨错过键属性:
let card = [];
_.times(8, (i) => {
card.push(?);
});
有关详细信息.times,请参阅此处:https://lodash.com/docs#times
声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/blog/jquery/detail/13439
推荐阅读
- 如何解决《在javascript中具有特定形状的词云》经验，为你挑选了0个好方法。javascript,wordle,word-cloud,d3.js,https,算法,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具... [详细]
赞
踩
- 如何解决《if(array.length===1)条件不适用于长度>1的数组》经验，为你挑选了1个好方法。javascript,arrays,angularjs,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,... [详细]
赞
踩
- 如何解决《如何从我的汇总捆绑包中保留bower包依赖项？》经验，为你挑选了0个好方法。javascript,bower,ecmascript-6,gulp,rollupjs,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发... [详细]
赞
踩
- 如何解决《从数组中删除对象-两种不同的方法,在查询每个数组的长度时有两种不同的结果》经验，为你挑选了1个好方法。javascript,arrays,jquery,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,jso... [详细]
赞
踩
- 如何解决《如何像转盘一样将标签滑入和滑出》经验，为你挑选了0个好方法。javascript,css,jquery,user-interface,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成... [详细]
赞
踩
- 如何解决《ECMAScript-6导入嵌套函数？》经验，为你挑选了1个好方法。javascript,ecmascript-6,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix时间戳,... [详细]
赞
踩
- 如何解决《JSDoc的输出可以组织成"文件夹"吗？》经验，为你挑选了0个好方法。javascript,commonjs,jsdoc,reactjs,webpack,DevBox,在线流程图,编程,编程问答,程序员,开发者... [详细]
赞
踩
- 如何解决《如何创建"逐步匹配"的正则表达式？》经验，为你挑选了1个好方法。javascript,regex,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix时间戳... [详细]
赞
踩
- 如何解决《Javascript:避免重新加载窗口》经验，为你挑选了1个好方法。javascript,html,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix时间戳,在线开发工具,前... [详细]
赞
踩
- 如何解决《使用'_'React/React-native为函数名添加前缀是什么意思？》经验，为你挑选了1个好方法。javascript,reactjs,react-native,DevBox,在线流程图,编程,编程问答,程序... [详细]
赞
踩
- 如何解决《即使没有人在监听,JavaScript事件也会一直执行吗？》经验，为你挑选了1个好方法。javascript,events,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix... [详细]
赞
踩
- 如何解决《jQueryUIdatepicker的属性选项》经验，为你挑选了2个好方法。jquery,jquery-ui,custom-data-attribute,jquery-ui-datepicker,https,javascript,... [详细]
赞
踩
- 如何解决《用枚举编写JSON键》经验，为你挑选了1个好方法。javascript,json,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二维码生成,unix时间戳,在线开发工具,前端开发工具,开发人... [详细]
赞
踩
- 如何解决《JQuery在Firefox中不起作用,但在Chrome中起作用》经验，为你挑选了1个好方法。javascript,css,firefox,jquery,google-chrome,DevBox,在线流程图,编程,编程问答,程序员... [详细]
赞
踩
- 如何解决《如何在课后删除空元素？(jQuery)》经验，为你挑选了1个好方法。html,javascript,css,wordpress,jquery,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,二... [详细]
赞
踩
- 如何解决《TypeScript中"=>"的含义是什么？(胖箭)》经验，为你挑选了5个好方法。typescript,https,javascript,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发... [详细]
赞
踩
- 如何解决《量角器检查位置路径》经验，为你挑选了1个好方法。javascript,selenium,automation,angularjs,protractor,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,jso... [详细]
赞
踩
- 如何解决《如何使用webpack从node_modules加载静态CSS文件？》经验，为你挑选了1个好方法。javascript,css,webpack,webpack-style-loader,npm,DevBox,在线流程图,编程,编程... [详细]
赞
踩
- 如何解决《匿名函数VSconst函数--javascript》经验，为你挑选了1个好方法。javascript,const,function,https,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,json解析,... [详细]
赞
踩
- 如何解决《如何在单击angularjs时调用两个函数》经验，为你挑选了2个好方法。angularjs,angularjs-ng-click,javascript,DevBox,在线流程图,编程,编程问答,程序员,开发者工具,开发工具,jso... [详细]
赞
踩
相关标签
