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 ...
随机推荐
- 前端html1.
HTML介绍 转载http://www.cnblogs.com/liwenzhou/p/7988087.html Web服务本质 import socket sk = socket.socket() ...
- 20165234 《Java程序设计》第二周学习总结
第二周学习总结 教材学习内容总结 第二章 标识符与关键字 1.标识符 其本质是文件名字. 由字母.下画线.美元符号和数字组成,长度不受限制. 标识符的第一个字符不能为数字,标识符不能为关键字(如int ...
- PHP反序列化漏洞
反序列化漏洞利用的条件 1.程序中存在序列化字符串的输入点. 2.程序中存在可以利用的魔术方法. 反序列化漏洞的一个简单DEMO <?php class example { public $ha ...
- Java基础5-接口
昨日内容回顾 jvm参数设置 -Xmx //设置最大堆大小 java -Xmx512m Classname -Xms //设置初始堆大小 java -Xms24m Classname -Xss //设 ...
- 【php】下载站系统Simple Down v5.5.1 xss跨站漏洞分析
author:zzzhhh 一. 跨站漏洞 利用方法1,直接在搜索框处搜索<script>alert(/xss/)</script>//',再次刷新,跨站语句将被 ...
- 【转】HTTP
[转]HTTP 一.http概述 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.所有的WWW文件都必须遵守这个标准.设计HTT ...
- Shell-find . -type f -name "*.php" -print0 | xargs -0 wc -l
统计一个源代码目录中所有 php 文件的行数
- mac安装adb
安装 brew cask install android-platform-tools 测试 adb devices
- 解决python发送multipart/form-data请求上传文件的问题
服务器接收文件时,有时会使用表单接收的方式,这意味着我们需要使用Python的requests上传表单数据和文件. 常用的方式一般如下: data = { 'name': 'nginx' } file ...
- svn更新出现冲突的解决方法
Conflict discovered in '/Users/apple/EtaxiAppServer/common/src/com/yaotaxi/db/MongoDBHelper.java'. S ...