vue实现全局内容,全局页面,比如每个页面都添加一个悬浮菜单。以及添加例外的页面,在某个页面不显示悬浮的菜单。vue全局变量 电脑版发表于:2023/2/16 10:20 ### vue实现全局的页面内容,很简单加到App.vue里边就行 比如每个页面都添加一个悬浮菜单。以及添加例外的页面,在某个页面不显示悬浮的菜单  像正常那样引用组件就行了。chatentry.vue就是封装的悬浮菜单的方法。这样引用之后所有页面都有这个悬浮的菜单效果了。  **如果想要某个页面,不出现这个悬浮菜单,其实在app.vue里边使用v-if判断一下,如果是某个页面就不出现** ``` <div v-if="locaUrl.indexOf('/chatmain')==-1"> <Chatentry /> </div> ``` 下面js中去获取一下当前页面的地址,因为是根据这个地址判断的 ``` export default { name: 'App', components: { Chatentry }, data() { return { locaUrl: '' } }, mounted() { // 获取一下当前页面的地址 this.locaUrl = location.href // console.log(this.$route) // console.log(this.$route.path) // console.log(this.$router) } } ``` **这样可能会出现需要刷新才出来的情况,因为mounted方法执行时机的问题可以要换成这样写** 下面获取的时候只获取location ``` mounted() { this.mylocation = location // alert(location.href) // this.locaUrl = location.href } ``` 然后上面去即时获取href ``` <template> <div id="app"> <router-view /> <div v-if="mylocation.href.indexOf('/chatmain')==-1&&mylocation.href.indexOf('/login')==-1"> <Suspendmenuentry /> </div> </div> </template> ``` ### Vue全局变量 也很简单,在mian.js里边定义就行了  或者也是直接使用 