<div class="fullseller" :class="{ full: flag }"> <seller class="seller" ref="seller2"></seller> <div class="iconfont icon-expand-alt icon" @click="full" v-if="!flag" ></div><div class="fullmap" :class="{ full: flag5 }"> <Map class="map" ref="map2"></Map> <div class="iconfont icon-expand-alt icon" @click="full5" v-if="!flag5" ></div>data() { return { flag: false, flag1: false, flag2: false, flag3: false, flag4: false, flag5: false, }; }, components: { hot, seller, trend, Map, rank, stock, },small() { this.flag = false; this.$nextTick(() => { this.$refs.seller2.changesize(); }); }, small1() { this.flag1 = false; this.$nextTick(() => { this.$refs.trend2.screenAdapter(); }); }, small2() { this.flag2 = false; this.$nextTick(() => { this.$refs.rank2.screenAdapter(); }); }, small3() { this.flag3 = false; this.$nextTick(() => { this.$refs.hot2.screenAdapter(); }); }, small4() { this.flag4 = false; this.$nextTick(() => { this.$refs.stock2.screenAdapter(); }); }, small5() { this.flag5 = false; this.$nextTick(() => { this.$refs.map2.screenAdapter(); });优化后代码

<div class="fullseller" :class="{ full: flag }">
<seller class="seller" ref="seller2"></seller>
<div class="iconfont icon-expand-alt icon" @click="full" v-if="!flag" ></div>
</div>

<div class="fullmap" :class="{ full: flag5 }">
<Map class="map" ref="map2"></Map>
<div class="iconfont icon-expand-alt icon" @click="full5" v-if="!flag5" ></div>
</div>

data() {
return {
flag: false,
flag5: false,
};
},

components: {
seller,
Map,
},

methods: {
full() {
this.flag = !this.flag;
this.$nextTick(() => {
this.$refs.seller2.changesize();
});
},

full5() {
this.flag5 = !this.flag5;
this.$nextTick(() => {
this.$refs.map2.screenAdapter();
});
},
}