轮播图优化:

1.http请求优化
2. 方法写到methods调用
3. 用async await同步写法
This commit is contained in:
jqtmviyu@gmail.com 2021-02-21 20:39:00 +08:00
parent d9ad531212
commit 2228c66b07

View File

@ -7,7 +7,7 @@
<!-- 2.轮播图 -->
<view class="swiper">
<u-swiper :list="list" height="340" border-radius="0"></u-swiper>
<u-swiper :list="swiperList" height="340" border-radius="0"></u-swiper>
</view>
</view>
@ -17,47 +17,25 @@
export default {
data() {
return {
list: [
// {
// image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
// title: '西'
// },
// {
// image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
// title: ''
// },
// {
// image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
// title: '西'
// }
]
swiperList: []
}
},
//
onLoad() {
uni.request({
url:'https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata',
})
// .then(console.log)
//promise
.then(res=>{
const message = res[1].data.message
// 1
/*
message.forEach(v => {
v.image = v.image_src
})
this.list = [...message]
*/
//2
this.list = message.map(v=>({
...v,image:v.image_src
}))
//({}), , ,(), return
})
this.getSwiper();
},
methods: {
// getSwiper(){
// this.$u.get("/home/swiperdata")
// .then(res=>{
// this.swiperList = res.message.map(v=>({...v,image:v.image_src}))
// })
// }
async getSwiper(){
const { message } = await this.$u.get("/home/swiperdata")
this.swiperList = message.map(v=>({...v,image:v.image_src}))
}
}
}
</script>