一、问题：
当每个页面都需要一个返回按钮时，为了提高效率 ，可以在App.vue页面写一个公共的，这样就可以在每个页面显示了。
二、具体代码：
1.html代码：
<template>
<div id="app">
<!-- 1.当某一个页面不想引入这个公共组件，用v-show判断路由 -->
<div class="return_btn" @click="ruturnBtn()"
v-show="!(path ==='/pc_hospitalData') && !(path ==='/pc-headquarters')">
返回
</div>
</div>
</template>
2.js代码：
//2.当某一个页面不想引入这个公共组件
mounted() {
this.path = this.$route.path;
// console.log(this.$route.path)
},
watch: {
$route(to, from) {
this.path = to.path
}
},
//点击返回上一页（如果没有上一页，默认返回首页）
methods: {
ruturnBtn() {
if (window.history.length <= 1) {
this.$router.push({
path: '/'
})
return false
} else {
this.$router.go(-1)
}
},
}
3.css代码：
.return_btn {
width: 90px;
height: 90px;
border-radius: 50%;
background-color: #4C8CFD;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
z-index: 999;
bottom: 150px;
right: 30px;
color: #fff;
font-size: 20px;
}
ending~
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/95998.html
