您现在的位置是：主页 > news > b2c网站提高订单转化率的方法/百度快速排名技术培训教程

b2c网站提高订单转化率的方法/百度快速排名技术培训教程

admin2025/5/15 17:58:39【news】

简介b2c网站提高订单转化率的方法,百度快速排名技术培训教程,网站要怎么做的,陈江做网站我们从零开始用vue搭建了外卖项目，对vue也有了更进一步的了解，我们从点菜，评价，商家三个模块逐步实现，我们来回顾一下以往模块：模块回顾点菜模块：评价模块:商家模块：模块优化我们现在…

b2c网站提高订单转化率的方法,百度快速排名技术培训教程,网站要怎么做的,陈江做网站我们从零开始用vue搭建了外卖项目，对vue也有了更进一步的了解，我们从点菜，评价，商家三个模块逐步实现，我们来回顾一下以往模块：模块回顾点菜模块：评价模块:商家模块：模块优化我们现在…

我们从零开始用vue搭建了外卖项目，对vue也有了更进一步的了解，我们从点菜，评价，商家三个模块逐步实现，我们来回顾一下以往模块：

模块回顾

点菜模块：

评价模块:

商家模块：

模块优化

我们现在需要更进一步完善我们的项目，现在有一个这样的需求：

当我们在点菜栏目下选择了对应产品，然后又浏览其他项目，此时如果我们返回点菜栏目下，那么对应商品还是依然会存在的。这个需求在技术上实现就需要用到vue的keep-alive。

现在我们在app.vue中加入keep-alive:

<template><div id="app"><myHeader :poiInfo="poiInfo"></myHeader><myNav :commentNum="commentNum"></myNav><keep-alive><router-view/></keep-alive></div>
</template>

<script>
import myHeader from "components/Header/Header";
import myNav from "components/Nav/Nav";

export default {name: "App",components: {myHeader,myNav},data() {return {poiInfo: {},commentNum: 0};},created() {this.$axios.get("api/goods").then(response => {let json = response.data;if (json.code === 0) {this.poiInfo = json.data.poi_info;}}).catch(function(error) {// handle errorconsole.log(error);});// 评价this.$axios.get("/api/rates").then(response => {let json = response.data;if (json.code === 0) {this.commentNum = json.data.comment_num;}}).catch(function(error) {// handle errorconsole.log(error);});}
};
</script>

<style>
#app {
}
</style>

我们使用<keep-alive>标签包裹<router-view/>也就是以上我们编写的三个模块。这样能在组件切换过程中将状态保留在内存中，防止重复渲染DOM。从而满足了我们项目需求，也提高了应用的性能。