Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
10.4k views
in Technique[技术] by (71.8m points)

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;
            });`

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

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


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...