当前位置: 首页 > article >正文

关于vue如何监听route和state以及各自对应的实际场景

一、监听route

场景:监听浏览器地址栏分页参数的变化

// 注意 newPageNum和 oldPageNum是 string类型
'$route.query.pageNum'(newPageNum, oldPageNum) {
	if (newPageNum !== oldPageNum && newPageNum !== this.pageNum.toString()) {
		this.handleCurrentChange(parseInt(newPageNum) || 1);
	}
},

'$route.query.pageSize'(newPageSize, oldPageSize) {
	if (newPageSize !== oldPageSize && newPageSize !== this.pageSize.toString()) {
		this.handleSizeChange(parseInt(newPageSize) || 20);
	}
}

二、监听state

场景:监听菜单栏的折叠与展开的状态

watch: {
	'$store.state.isCollapse'(newVal, oldV) {
	  	this.isCollapse = newVal
	}
},

http://www.kler.cn/a/386994.html

相关文章:

  • 【大数据学习 | HBASE高级】storeFile文件的合并
  • 用MVVM设计模式提升WPF开发体验:分层架构与绑定实例解析
  • 分布式锁实践方案
  • WEB攻防-通用漏洞SQL注入sqlmapOracleMongodbDB2等
  • flutter下拉刷新上拉加载的简单实现方式三
  • HBase使用create创建表时报错ERROR: KeeperErrorCode = NoNode for /hbase/master
  • 103 - Lecture 1
  • Web前端开发--HTML语言
  • Conpair: 配对样本一致性concordance与污染contamination分析
  • LLMs之MemFree:MemFree的简介、安装和使用方法、案例应用之详细攻略
  • 论文精读:NC kagome FeGe 自旋声子耦合驱动CDW 实验与理论计算
  • CCF ChinaOSC |「开源科学计算与系统建模openSCS专题分论坛」11月9日与您相约深圳
  • 《CIDEr: Consensus-based Image Description Evaluation》简要
  • Python毕业设计选题:基于django+vue的荣誉证书管理系统
  • 【Mode Management】AUTOSAR架构下唤醒源检测函数EcuM_CheckWakeup详解
  • 高级 <HarmonyOS主题课>构建华为支付服务的课后习题
  • Halcon 重写Rectangle2及Arrow
  • 专题——编程案例
  • Java | Leetcode Java题解之第552题学生出勤记录II
  • 全网最最最详细的haproxy详解!!!
  • 测试实项中的偶必现难测bug--苹果支付丢单问题
  • Python爬虫实战 | 爬取网易云音乐热歌榜单
  • 【开源免费】基于SpringBoot+Vue.JS水果购物网站(JAVA毕业设计)
  • Python小白学习教程从入门到入坑------第二十九课 访问模式文件定位操作(语法进阶)
  • Docker配置及简单应用
  • 探索 C++20:C++ 的新纪元