filter() 与 map() ,数据过滤以及接口数据映射
list: pois.filter((item) => {
return item.photos.length
}).map((item) => {
return {
type: item.type,
img: item.photos[0].url,
name: item.name,
price: Math.floor(Math.random() * 100),
comment: Math.floor(Math.random() * 1000),
rate: Math.floor(Math.random() * 10 / 2),
scene: item.tag,
status: '可订明日',
location: item.location,
module: item.type.split(';')[0]
}
}),
filter 过滤,当item 元素的 photos 里面有图片的时候,我们才要,没有就不要了
也可以简写
pois.filter(item=> item.photos.length) 满足条件的我就要,不满足的就不要
--------------------------------------------------------------------
接口数据映射 map()函数
map((item) => {
return {
type: item.type,
img: item.photos[0].url,
name: item.name,
price: Math.floor(Math.random() * 100),
comment: Math.floor(Math.random() * 1000),
rate: Math.floor(Math.random() * 10 / 2),
scene: item.tag,
status: '可订明日',
location: item.location,
module: item.type.split(';')[0]
}
})
最后返回的数据结构 是你定义好的 type,img,name 等等
Q:那么为什么要使用map呢?
A:如果,后端改api接口字段了,前端之前的字段没有改,那么我可以能一次要改很多地方,而且数据格式可能还不一样的;
前端一定要有自己的数据字段,使用map() 直接接口数据映射,我后面就只改映射时的字段就好!
切记,切记,坑进去了,就要爬出来!