使用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 相关文章推荐
解析Jquery中如何把一段html代码动态写入到DIV中(实例说明)
Jul 09 Javascript
javascript中setTimeout和setInterval的unref()和ref()用法示例
Nov 26 Javascript
浅析AngularJS Filter用法
Dec 28 Javascript
使用Jasmine和Karma对AngularJS页面程序进行测试
Mar 05 Javascript
Highcharts学习之坐标轴
Aug 02 Javascript
JavaScript实现简单的日历效果
Sep 25 Javascript
jQuery分页插件jquery.pagination.js使用方法解析
Feb 09 Javascript
vue-cli axios请求方式及跨域处理问题
Mar 28 Javascript
理解 JavaScript EventEmitter
Mar 29 Javascript
浅析vue中的MVVM实现原理
Mar 04 Javascript
javascript canvas API内容整理
Feb 16 Javascript
vue3 自定义图片放大器效果的示例代码
Jul 23 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中文字母数字验证码实现代码
2008/04/25 PHP
php 攻击方法之谈php+mysql注射语句构造
2009/10/30 PHP
破解图片防盗链的代码(asp/php)测试通过
2010/07/02 PHP
ThinkPHP关联模型操作实例分析
2012/09/23 PHP
PHP命令空间namespace及use的用法小结
2017/11/27 PHP
PHP延迟静态绑定使用方法实例解析
2020/09/05 PHP
Tab页界面,用jQuery及Ajax技术实现
2009/09/21 Javascript
基于jQuery的公告无限循环滚动实现代码
2012/05/11 Javascript
js获取鼠标点击的位置实现思路及代码
2014/05/09 Javascript
js获取网页可见区域、正文以及屏幕分辨率的高度
2014/05/15 Javascript
jquery.validate使用时遇到的问题
2015/05/25 Javascript
解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
2015/12/10 Javascript
jquery trigger实现联动的方法
2016/02/29 Javascript
微信小程序  modal弹框组件详解
2016/10/27 Javascript
AngularJS之自定义服务详解(factory、service、provider)
2017/04/14 Javascript
Vue2.0父子组件传递函数的教程详解
2017/10/16 Javascript
使用Vue写一个datepicker的示例
2018/01/27 Javascript
JavaScript EventEmitter 背后的秘密 完整版
2018/03/29 Javascript
详解Vue2 添加对scss的支持
2019/01/02 Javascript
浅谈Vue.js中如何实现自定义下拉菜单指令
2019/01/06 Javascript
vuejs简单验证码功能完整示例
2019/01/08 Javascript
Vue传参一箩筐(页面、组件)
2019/04/04 Javascript
swiper4实现移动端导航栏tab滑动切换
2020/10/16 Javascript
[33:23]Secret vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python语言编写电脑时间自动同步小工具
2013/03/08 Python
Python编程入门的一些基本知识
2015/05/13 Python
11月编程语言排行榜 Python逆袭C#上升到第4
2017/11/15 Python
django xadmin 管理器常用显示设置方式
2020/03/11 Python
全面介绍python中很常用的单元测试框架unitest
2020/12/14 Python
HTML5中canvas中的beginPath()和closePath()的重要性
2018/08/24 HTML / CSS
金宝贝童装官网:Gymboree
2016/08/31 全球购物
德国W家官网,可直邮中国的母婴商城:Windeln.de
2021/03/03 全球购物
大学生四年生活自我鉴定
2013/11/21 职场文书
幼儿园运动会加油词
2014/02/14 职场文书
大学优秀学生主要事迹材料
2015/11/04 职场文书
导游词之茶卡盐湖
2019/11/26 职场文书