vue 在.vue文件里监听路由
监听路由 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文件里监听路由的更多相关文章
- vue中监听路由参数变化
今天遇到一个这样的业务场景:在同一个路由下,只改变路由后面的参数值, 比如在这个页面 /aaa?id=1 ,在这个页面中点击一个按钮后 跳转到 /aaa?id=2 , 但从“/aaa?id=1”到“ ...
- vue 如何通过监听路由变化给父级路由菜单添加active样式
1.项目需求:在项目开发中,多级菜单的情况下,勾选子菜单时,需要在父级菜单添加active样式. 2.遇到的问题:一级路由菜单的话,点击当前路由会自动在路由标签上添加router-link-exact ...
- vue 定义全局函数,监听android返回键事件
vue 定义全局函数,监听android返回键事件 方法一:main.js 注入(1)在main.js中写入函数Vue.prototype.changeData = function (){ aler ...
- vue computed计算属性 watch监听
计算属性 computed:{ 变量:function(){ return 计算好的值 } } 这时候计算好的值 就付给了你的变量 在实例中可以this.使用 注意 声明的变量的data中不可以重复声 ...
- Vue.js中 watch(深度监听)的最易懂的解释
<div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text& ...
- vue使用element-ui的el-input监听不了回车事件解决
vue使用element-ui的el-input监听不了回车事件,原因应该是element-ui自身封装了一层input标签之后,把原来的事件隐藏了,所以如下代码运行是无响应的: <el-inp ...
- vue使用element-ui的el-input监听不了键盘事件解决
vue使用element-ui的el-input监听不了键盘事件,原因应该是element-ui自身封装了一层div在input标签外面,把原来的事件隐藏了,所以如下代码运行是无响应的: <el ...
- vue 如何在循环中 "监听" 的绑定v-model数据
vue 如何在循环中 "监听" 的绑定v-model数据 阅读目录 vue 如何在循环中 "监听" 的绑定v-model数据 1. 普通属性的值进行监听 2. ...
- vue解惑之v-on(事件监听指令)
一.v-on指令 vue中用v-on指令来监听DOM事件,并触发相应的代码.比如v-on:click,表示监听了点击事件. 二.事件修饰符 在事件处理函数中调用 event.preventDefaul ...
随机推荐
- JDK、JRE、JVM三者间的关系(待更新...)
JDK(Java Development Kit) JDK中包含JRE,在JDK的安装目录下有一个名为jre的目录,里面有两个文件夹bin和lib,在这里可以认为bin里的就是jvm,lib中则是jv ...
- Codeforces Round #545 (Div. 2)(B. Circus)
题目链接:http://codeforces.com/contest/1138/problem/B 题目大意:贼绕口的题目,就是给你两个字符串s1,s2,然后每一个人代表一列,第一列代表技能一每个人是 ...
- MySql cmd下的学习笔记 —— 有关建立表的操作(有关于数据类型)
(01)建表的过程实际上是 声明字段 的过程 一. 列类型(字段): 存储同样的数据时,不同的列类型,所占据的空间和效率是不一样的,这就是建表时要考虑的意义. 二.MySQL三大列类型 数值型 ...
- openstack Q版部署-----glance安装配置(4)
镜像服务(glance)使用户能够发现,注册和检索虚拟机镜像. 它提供了一个REST API,使您可以查询虚拟机镜像元数据并检索实际镜像. 您可以将通过镜像服务提供的虚拟机映像存储在各种位置,从简单的 ...
- python,小练习(计算两点之间直线长度)
#首先引入数学函数 import math #创建一个点的类 class Point(): #初始化点的坐标(x,y) def __init__(self,x=0,y=0): self.x = x s ...
- webrtc学习笔记
获取笔记本摄像头视频流 <html> <meta http-equiv="Content-Type" content="text/html; chars ...
- 系统更新报错--NO_PUBKEY
错误信息 W: An error occurred during the signature verification. The repository is not updated and the p ...
- 【上载虚拟机】XX是一个Workstations 12.X虚拟机,不受XX支持。请选择其他主机或将虚拟机的硬件版本更改为以下选项之一。
背景 由于搭建集群时,要使用Ubuntu系统,还有一点就是咱们使用的Ubuntu系统是定制的,但是它是一个虚拟机,需要通过VMware Workstations这款软件,把咱们定制好的Ubuntu系统 ...
- 关于Anaconda的环境和包管理
Anaconda相对于原生python解释器具有更好的包管理功能,它有一个env文件夹,里面包含所要管理的所有环境:日常操作时我们可能会使用pytorch.Tensorflow等多个环境,由于每个环境 ...
- 使用unix的time命令进行简单的计时
/usr/bin/time -p python3 1.py 需要注意这里使用的是/usr/bin/time 命令而不unix系统自带time. 输出 real 0.04 user 0.03 sys 0 ...