之前写代码,从后台提取数据并渲染到前台,由于有多组数据,用map遍历会相对方便一点,但是
map不能遍历array数组,只能遍历object对象。
所以如果遇到这样的问题可以采用forEach试一下
forEach
import React,{Component} from 'react';
let list=[
{
name:"百度",
address:"http://www.baidu.com"
},
{
name:"google",
address:"http://www.google.cn"
},
{
name:"firefox",
address:"https://home.firefoxchina.cn"
}
];
class forEach extends Component{
render(){
//定义一个数组,将数据存入数组
const elements=[];
list.forEach((item)=>{
elements.push(
<div>
{item.name}
<a>{item.address}</a>
<hr/>
</div>
)
});
return(
<div>
{elements}
</div>
)
}
}
export default forEach;
map
import React,{Component} from 'react';
let list=[
{
name:"百度",
address:"http://www.baidu.com"
},
{
name:"google",
address:"http://www.google.cn"
},
{
name:"firefox",
address:"https://home.firefoxchina.cn"
}
];
class forEach extends Component{
render(){
return(
list.map((item)=>
<div>
{item.name}
<a>{item.address}</a>
<hr/>
</div>
)
)
}
}
export default forEach;
欢迎大家关注我的微信公众号