react的map遍历_javamap遍历方式
2023-06-13 09:13:30 时间
记录一下项目制作过程中学到的一些方法,以便温习
render(){
return (
<ul className={style.decoratewrapper}>
{
this.state.decoratedata.map((item,i) => (
<li key={i}>
<div className={style.img}><img src={require("./images/"+item.src+".jpg")} /></div>
<List>
<Item extra={ <Button className={style.used} type={item.type} size="small" inline>使用中</Button> }>{item.name}</Item>
</List>
</li>
))
}
</ul>
);
}
上面的map写在return里面, 当加上点击事件时会出问题,需将map遍历写在return外面,如下:
clickButton (ind, usestate) {
console.log(ind, usestate);
};
render(){
let _this = this;
let list = this.state.themedata.map((item,i) => (
<li key={i}>
<div className={style.img}><img src={require("./images/"+item.src+".jpg")} /></div>
<List>
<Item extra={ <Button className={style.used} type={item.isUsing?"primary":"ghost"} size="small" inline onClick={ _this.clickButton.bind(this, i, item.isUsing) }>{item.isUsing ? "使用中" : "使用"}</Button> }>{item.name}</Item>
</List>
</li>
));
return (
<ul className={style.themewrapper}>
{list}
</ul>
);
}
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/193023.html原文链接:https://javaforall.cn
相关文章
- fastjson jsonobject转map对象_jsonobject遍历
- c++中map遍历_怎么遍历map集合
- Java中 遍历 ArrayList的三种方法
- Java:遍历数组的三种方法[通俗易懂]
- MAP遍历_map容器遍历
- 遍历hashmap的三种方式_java map 遍历删除
- Map嵌套Map遍历[通俗易懂]
- java map是有序的吗_java中map遍历
- js二叉树层序遍历
- Java基础——List、Set、Map的简单操作与遍历
- LeetCode——遍历序列构造二叉树
- Java通过递归进行二叉树遍历详解编程语言
- javascript遍历select下拉框判断其中值是否与指定值相等详解编程语言
- java语言遍历MAP的常用方法详解编程语言
- JAVA遍历Map的方法详解编程语言
- 遍历Map的四种方法详解编程语言
- Redis有序Map:高效有序排列的利器(redis有序map)
- 遍历MSSQL所有表:一步一步深入(遍历所有表 mssql)
- 使用Redis存储Map结构数据(将map存到redis中)
- 解决Redis频繁修改Map难题(redis频繁修改map)
- 科学上网如何使用Oracle MAP(oracle map使用)
- Redis脚本快速遍历Map集(redis脚本遍历map)
- C++非递归遍历磁盘文件和递归遍历磁盘文件的程序示例
- 遍历DOM对象内的元素属性示例代码
- java集合map取key使用示例java遍历map