监听路由  watch   $route

vue项目中的App.vue 文件

<template>
<div id="app">
<!--include=[AdminUserManage,createUser]-->
<keep-alive >
<router-view/>
</keep-alive>
<TabBer v-if="tabbarshow"/> </div>
</template>
<script>
import TabBer from './components/public/TabBar.vue'
export default {
components:{
TabBer,
},
data() {
return {
tabbarshow:false
}
},
watch: {
$route(to,from) {
if(this.$route.path == "/Home"){
this.tabbarshow = true
}else if(this.$route.path =='/more'||this.$route.path =='/More'){
this.tabbarshow = true
}else{
this.tabbarshow = false
}
}
},
created(){
if(this.$route.path == "/Home"){
this.tabbarshow = true
}else if(this.$route.path =='/more'||this.$route.path =='/More'){
this.tabbarshow = true
}else{
this.tabbarshow = false
}
}
}
</script> <style> </style>

vue 在.vue文件里监听路由的更多相关文章

  1. vue中监听路由参数变化

    今天遇到一个这样的业务场景:在同一个路由下,只改变路由后面的参数值, 比如在这个页面  /aaa?id=1 ,在这个页面中点击一个按钮后 跳转到 /aaa?id=2 , 但从“/aaa?id=1”到“ ...

  2. vue 如何通过监听路由变化给父级路由菜单添加active样式

    1.项目需求:在项目开发中,多级菜单的情况下,勾选子菜单时,需要在父级菜单添加active样式. 2.遇到的问题:一级路由菜单的话,点击当前路由会自动在路由标签上添加router-link-exact ...

  3. vue 定义全局函数,监听android返回键事件

    vue 定义全局函数,监听android返回键事件 方法一:main.js 注入(1)在main.js中写入函数Vue.prototype.changeData = function (){ aler ...

  4. vue computed计算属性 watch监听

    计算属性 computed:{ 变量:function(){ return 计算好的值 } } 这时候计算好的值 就付给了你的变量 在实例中可以this.使用 注意 声明的变量的data中不可以重复声 ...

  5. Vue.js中 watch(深度监听)的最易懂的解释

    <div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text& ...

  6. vue使用element-ui的el-input监听不了回车事件解决

    vue使用element-ui的el-input监听不了回车事件,原因应该是element-ui自身封装了一层input标签之后,把原来的事件隐藏了,所以如下代码运行是无响应的: <el-inp ...

  7. vue使用element-ui的el-input监听不了键盘事件解决

    vue使用element-ui的el-input监听不了键盘事件,原因应该是element-ui自身封装了一层div在input标签外面,把原来的事件隐藏了,所以如下代码运行是无响应的: <el ...

  8. vue 如何在循环中 "监听" 的绑定v-model数据

    vue 如何在循环中 "监听" 的绑定v-model数据 阅读目录 vue 如何在循环中 "监听" 的绑定v-model数据 1. 普通属性的值进行监听 2. ...

  9. vue解惑之v-on(事件监听指令)

    一.v-on指令 vue中用v-on指令来监听DOM事件,并触发相应的代码.比如v-on:click,表示监听了点击事件. 二.事件修饰符 在事件处理函数中调用 event.preventDefaul ...

随机推荐

  1. 基于【字符】操作的IO接口:Writer、Reader

    Reader public class BufferedReaderTest { public static void main(String[] args) throws IOException { ...

  2. C中的malloc/free与C++中的new/delete的用法与区别

    1.先介绍malloc/free的用法: 原型函数: void *malloc(long NumBytes); 该函数分配了NumBytes个字节的内容,分配的空间是堆空间 malloc()根据用户所 ...

  3. 【ARTS】01_13_左耳听风-20190204~20190210

    ARTS: Algrothm: leetcode算法题目 Review: 阅读并且点评一篇英文技术文章 Tip/Techni: 学习一个技术技巧 Share: 分享一篇有观点和思考的技术文章 Algo ...

  4. linux syscall 详解【转】

    转自:https://blog.csdn.net/feixin620/article/details/78416560 引言:分析Android源码的过程中,要想从上至下完全明白一行代码,往往涉及ap ...

  5. gPRC学习笔记

    gPRC学习笔记 gPRC基础教程. gPRC官方文档. protobuf 3.0的简易教程. 什么是RPC RPC(remote procedure call) -- 远程过程调用(相对于本地调用的 ...

  6. 生产环境elasticsearch5.0报错IllegalArgumentException: number of documents in the index cannot exceed 2147483519的处理

    最近几天的push:user:req数据写不到集群,报错如下: [--13T09::,][DEBUG][o.e.a.b.TransportShardBulkAction] [yunva_etl_es8 ...

  7. MySQL配置说明

    以下内容,来源于http://www.jb51.net/article/48082.htm [client] port = 3306 socket = /tmp/mysql.sock [mysqld] ...

  8. Maven中央仓库地址整理

    最近做项目的时候,一直发现常用的oschina maven源一直都没有反应,后面发现原来oschina竟然关闭了maven源服务,后面经同事推荐了阿里云的maven源,这速度杠杠的 Maven 中央仓 ...

  9. Go代码重构:23倍的性能爆增

    几周前,我读了一篇名为“ Good Code vs Go Code中的错误代码 ”的文章,作者指导我们逐步完成实际业务用例的重构. 本文的重点是将“坏代码”转变为“良好代码”:更具惯用性,更易读,利用 ...

  10. Swift 学习- 01 -- 基础部分

    print("世界,你好") var myVariable = 42 myVariable = 50 let myConstant = 42 let implicitinteger ...