vue使用watch 观察路由变化,重新获取内容
watch: {
$route(to) {
console.log(to)
if (to.path.indexOf('index') != -1) {
//路由变化后重新获取帖子列表
this.$http.get('/api/communityList').then((res) => {
if (res.data.errCode === 0) {
let getRes = res.data.data.hotList
this.postList = getRes
}
})
}
}
}
vue使用watch 观察路由变化,重新获取内容的更多相关文章
- 【vue】——使用watch 观察路由变化,重新获取内容
更新:11-29 时隔半年,又重新使用VUE进行开发,有了新方案--beforeRouteLeave 在组件内直接使用,前提是你用了vue-router: beforeRouteLeave (to, ...
- vue监听路由变化
使用 watch,观察路由,一旦发生变化便重新获取数据 watch: { // 如果路由有变化,会再次执行该方法 '$route': 'fetchData' }
- vue 如何通过监听路由变化给父级路由菜单添加active样式
1.项目需求:在项目开发中,多级菜单的情况下,勾选子菜单时,需要在父级菜单添加active样式. 2.遇到的问题:一级路由菜单的话,点击当前路由会自动在路由标签上添加router-link-exact ...
- Vue(三)之前端路由
01-前端路由 1.前端路由的实现原理 vue+vue-router 主要来做单页面应用(Single Page Application) 为什么我们要做单页面应用? (1)传统的开发方式 url改变 ...
- Vue-- 监听路由变化,数据无法更新?
之前写的Vue项目,有个问题困扰了好久.新闻板块有推荐.精华.最新等几个Tab,设想通过切换Tab,改变路由参数(get/news/:tab)去获取对应数据,然后渲染到页面(用的是同一套组件),问题来 ...
- vue - 过滤器-钩子函数路由
一.关于路由 1.使用vue router 本质上是声明一种可以通过路径进行 挂子,用子 找到对应的 template 进行页面渲染 <!DOCTYPE html> <html la ...
- 路由传值及获取参数,路由跳转,路由检测,this.$route.query和this.$route.params接收参数,HttpGet请求拼接url参数
配置动态路由参数id: routes: [ // 动态路径参数 以冒号开头 { path: '/user/:id', component: User } ] html路由跳转: <router- ...
- vue之vue-router嵌套路由
1.定义路由 routes: [ { path: '/product', //第一层路由 name: 'product', component: Vproductcontent,//父组件渲染的是子组 ...
- vue学习记录④(路由传参)
通过上篇文章对路由的工作原理有了基本的了解,现在我们一起来学习路由是如何传递参数的,也就是带参数的跳转. 带参数的跳转,一般是两种方式: ①.a标签直接跳转. ②点击按钮,触发函数跳转. 在上篇文章中 ...
随机推荐
- javascript相关基础
1.javascript:void(0) javascript:void(0)表示不做任何动作 Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值. <a hr ...
- RelativeLayout 高度宽度
RelativeLayout ss = (RelativeLayout) findViewById(R.id.myRelativeLayout); ss.setLayoutParams(new Rel ...
- lupgu P3950 部落冲突
题目链接 luogu P3950 部落冲突 题解 树剖线段树可以 lct还行 代码 #include<cstdio> #include<algorithm> inline in ...
- NOI.AC NOIP模拟赛 第四场 补记
NOI.AC NOIP模拟赛 第四场 补记 子图 题目大意: 一张\(n(n\le5\times10^5)\)个点,\(m(m\le5\times10^5)\)条边的无向图.删去第\(i\)条边需要\ ...
- MySQL 集群
MySQL Galera介绍 主要功能: 同步复制 真正的multi-master,即所有节点可以同时读写数据库 自动的节点成员控制,失效节点自动被清除 新节点加入数据自动复制 真正的并行复制,行级 ...
- Markdown基础用法
1. 标题 文字前加#,共6级标题,# 一级标题,## 二级标题,...,###### 六级标题 2. 列表 文字前加-或* 即可变无序列表,文字前加 数字. 即可变有序列表 3. 引用 在引用文本前 ...
- c# -- 解决vs使用本地iis运行项目支持局域网访问的问题(附防火墙端口开放步骤)
用vs运行项目时,有时候需要局域网内不同设备进行访问调试~ 以前解决过这个问题,这次用了部新电脑,问题又出现了,改了配置还是不行,原来还差了一步防火墙端口开放访问. 于是写了这篇分享,备忘~ 操作步骤 ...
- IMG镜像写盘工具physdiskwrite,用于MikroTik RouterOS的安装(Windows)
常用img的备份: 1.linux下使用dd,Windows下使用WinImage 2.或者还有很多,比如再生龙等等. img还原: 1.Win32DiskImager 2.physdiskwrite ...
- @RequestParam @RequestBody @PathVariable 等参数绑定注解详解(转)
引言: 接上一篇文章,对@RequestMapping进行地址映射讲解之后,该篇主要讲解request 数据到handler method 参数数据的绑定所用到的注解和什么情形下使用: 简介: han ...
- bitnami下webmin安装
下载 我在官方网站下载最新的安装包(webmin_1.670_all.deb):http://sourceforge.net/projects/webadmin/files/webmin 安装 单独 ...