使用watch监听路由变化和watch监听对象的实例


Posted in Javascript onFebruary 24, 2018

一、watch监听路由变化

解决办法:

export default{
data(){
return{}
},
watch:{
"$route":"getPath" // 监听事件
},
methods:{
getPath(){
let path = this.$roune.path; //或得当前路径
进行逻辑判断
}
}
}

二、watch监听对象

例子:

<el-select v-model="form.region" placeholder="请选择">
   <el-option
     v-for="item in rootCategory" :key="item.id"
     :label="item.name"
     :value="item.id">
   </el-option>
</el-select>
export default{
data(){
return{ 
form:{ 
region:""
}
}
},
watch:{
'form.region':function(newValue,oldValue){
console.info(newValue);
console.info(oldValue);
}
}
}

以上这篇使用watch监听路由变化和watch监听对象的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
深入理解JavaScript系列(7) S.O.L.I.D五大原则之开闭原则OCP
Jan 15 Javascript
自动刷新网页,自动刷新当前页面,JS调用
Jun 24 Javascript
引入JS文件IE6报语法错误或缺少对象问题的解决方法
Jan 09 Javascript
Jquery实现仿腾讯微博发表广播
Nov 17 Javascript
jQuery使用prepend()方法在元素前添加内容用法实例
Mar 26 Javascript
详解Node.js包的工程目录与NPM包管理器的使用
Feb 16 Javascript
javascript仿京东导航左侧分类导航下拉菜单效果
Nov 25 Javascript
几种经典排序算法的JS实现方法
Mar 25 Javascript
使用React实现轮播效果组件示例代码
Sep 05 Javascript
JS+CSS实现炫酷光感效果
Sep 05 Javascript
vue项目中使用rem,在入口文件添加内容操作
Nov 11 Javascript
vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件
Feb 20 Vue.js
vue watch监听对象及对应值的变化详解
Feb 24 #Javascript
解决Vue不能检测数组或对象变动的问题
Feb 24 #Javascript
vue将对象新增的属性添加到检测序列的方法
Feb 24 #Javascript
jQuery实现碰到边缘反弹的动画效果
Feb 24 #jQuery
vue cli webpack中使用sass的方法
Feb 24 #Javascript
vue-cli常用设置总结
Feb 24 #Javascript
JS处理一些简单计算题
Feb 24 #Javascript
You might like
php短址转换实现方法
2015/02/25 PHP
PHP使用数组依次替换字符串中匹配项
2016/01/08 PHP
ThinkPHP打水印及设置水印位置的方法
2016/10/14 PHP
Mootools 1.2教程 函数
2009/09/15 Javascript
js 获取中文拼音,Select自动匹配字母获取值的代码
2009/09/23 Javascript
firefox下input type=&quot;file&quot;的size是多大
2011/10/24 Javascript
jQuery简单实现隐藏以及显示特效
2015/02/26 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
2015/03/26 Javascript
jQuery匹配文档链接并添加class的方法
2015/06/26 Javascript
Java Mybatis框架入门基础教程
2015/09/21 Javascript
JS调用打印机功能简单示例
2016/11/28 Javascript
基于node下的http小爬虫的示例代码
2018/01/11 Javascript
web前端vue filter 过滤器
2018/01/12 Javascript
基于Bootstrap下拉框插件bootstrap-select使用方法详解
2018/08/07 Javascript
js自定义input文件上传样式
2018/10/26 Javascript
微信小程序实现保存图片到相册功能
2018/11/30 Javascript
微信小程序如何播放腾讯视频的实现
2019/09/20 Javascript
vue 组件间的通信之子组件向父组件传值的方式
2020/07/29 Javascript
[01:23]一分钟告诉你 DOTA2为什么叫信仰2
2014/06/20 DOTA
[46:53]Secret vs Liquid 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python实现多行注释的另类方法
2014/08/22 Python
简单解析Django框架中的表单验证
2015/07/17 Python
Python使用tablib生成excel文件的简单实现方法
2016/03/16 Python
python找出完数的方法
2018/11/12 Python
详解python读取image
2019/04/03 Python
django models里数据表插入数据id自增操作
2020/07/15 Python
Python word文本自动化操作实现方法解析
2020/11/05 Python
matplotlib交互式数据光标实现(mplcursors)
2021/01/13 Python
如何使用css3实现一个类在线直播的队列动画的示例代码
2020/06/17 HTML / CSS
客户答谢会活动方案
2014/08/31 职场文书
校园广播稿精选
2014/10/01 职场文书
加入学生会自荐书
2015/03/05 职场文书
2015年档案管理工作总结
2015/04/08 职场文书
安全生产警示教育活动总结
2015/05/09 职场文书
Python爬取用户观影数据并分析用户与电影之间的隐藏信息!
2021/06/29 Python
基于Redission的分布式锁实战
2022/08/14 Redis