H5W3
当前位置:H5W3 > 问答 > 正文

vue跳转数据加载问题

这是一个列表循环的子组件
,点击的时候传点击事件给父组件,父组件里跳转到详情页,这样写有问题吗,在ios点击跳转到详情页加载数据特别慢,显示默认数据有几秒钟才能加载上,下面是我列表和详情的代码
列表组件:
<view v-for="(item,index) in data" @click="toDetail(item)"></view>

列表页面:
` <house-list :data=”dataList” :dataEnd=”dataEnd” @listDetail=”listDetail”></house-list>
listDetail(idx1) {

        let city_id = uni.getStorageSync('city_id');
this.$mRouter.push({
route: `/pages/housedetail/housedetail?estate_id=${idx1}&city_id=${city_id}`
});
},

`
详情页:
` onLoad(params){

    this.housePro();

}`
`async housePro() {

        let params = {
estate_id: this.estate_id,
city_id: this.city_id
}
await this.$http
.post(`${houseDetail}`, params)
.then(async res => {
this.unit = res.data.unit
this.swiperList = res.data.img
this.is_focus = res.data.is_focus
this.titleStr.estate_name = res.data.estate_name
this.titleStr.rmb_price_min = res.data.rmb_price_min
this.titleStr.rmb_price_max = res.data.rmb_price_max
this.titleStr.price_min = res.data.price_min
this.titleStr.price_max = res.data.price_max
this.titleStr.money_type = res.data.money_type
this.titleStr.money_name = res.data.money_name
this.titleStr.property_date_int = res.data.property_date_int
this.titleStr.property_year = res.data.property_year
this.titleStr.rate = res.data.rate
this.titleStr.tags = res.data.tags
this.property_year = res.data.property_year
this.parking_num = res.data.parking_num
this.money_rate = parseFloat(res.data.money_rate)
this.content = res.data.content
this.property_title = res.data.property_title
this.total = res.data.total
this.area_covered = res.data.area_covered
this.developer_name = res.data.developer_name
this.developer_description = res.data.developer_description
this.developer_logo = res.data.developer_logo
this.developer_start_year = res.data.developer_start_year
this.country_name = res.data.country_name
this.city_name = res.data.city_name
this.postcode = res.data.postcode
this.estate_address = res.data.estate_address
this.money_type = res.data.money_type
this.money_name = res.data.money_name
this.property_fee = res.data.property_fee
this.fit_up_val = res.data.fit_up_val
this.estate_step = res.data.estate_step.slice(0,8)
this.houseTypeList = res.data.houseTypeList
this.heating_mode = res.data.heating_mode
this.property_company = res.data.property_company
this.property_company_address = res.data.property_company_address
this.supporting_facility = res.data.supporting_facility
this.center.lng = res.data.lon
this.center.lat = res.data.lat
this.circum_list = res.data.circum_list
//置业顾问
if(Object.keys(res.data.broker_info).length > 0){
this.broker_info = res.data.broker_info
this.nameNew = false
}else{
this.navTitle.splice(3, 1,'');
this.nameNew = true
}
this.tabLists = res.data.circum_list
this.tabList = this.objArr(res.data.circum_list,0)
})
.catch(() => {
//this.loading = false;
});`

回答

至少可以把详情页housePro函数中的赋值语改一下。可以把很多data的属性,放在一个对象里面,然后赋值的时候通过for循环来赋值,至少这样代码看起来会简洁些。然后跳转的话,应该可以直接放在子组件里面跳转的。另外,异步请求一般是放在created或者mounted钩子函数中。

本文地址:H5W3 » vue跳转数据加载问题

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址