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 观察路由变化,重新获取内容的更多相关文章

  1. 【vue】——使用watch 观察路由变化,重新获取内容

    更新:11-29 时隔半年,又重新使用VUE进行开发,有了新方案--beforeRouteLeave 在组件内直接使用,前提是你用了vue-router: beforeRouteLeave (to, ...

  2. vue监听路由变化

    使用 watch,观察路由,一旦发生变化便重新获取数据 watch: { // 如果路由有变化,会再次执行该方法 '$route': 'fetchData' }

  3. vue 如何通过监听路由变化给父级路由菜单添加active样式

    1.项目需求:在项目开发中,多级菜单的情况下,勾选子菜单时,需要在父级菜单添加active样式. 2.遇到的问题:一级路由菜单的话,点击当前路由会自动在路由标签上添加router-link-exact ...

  4. Vue(三)之前端路由

    01-前端路由 1.前端路由的实现原理 vue+vue-router 主要来做单页面应用(Single Page Application) 为什么我们要做单页面应用? (1)传统的开发方式 url改变 ...

  5. Vue-- 监听路由变化,数据无法更新?

    之前写的Vue项目,有个问题困扰了好久.新闻板块有推荐.精华.最新等几个Tab,设想通过切换Tab,改变路由参数(get/news/:tab)去获取对应数据,然后渲染到页面(用的是同一套组件),问题来 ...

  6. vue - 过滤器-钩子函数路由

    一.关于路由 1.使用vue router 本质上是声明一种可以通过路径进行 挂子,用子 找到对应的 template 进行页面渲染 <!DOCTYPE html> <html la ...

  7. 路由传值及获取参数,路由跳转,路由检测,this.$route.query和this.$route.params接收参数,HttpGet请求拼接url参数

    配置动态路由参数id: routes: [ // 动态路径参数 以冒号开头 { path: '/user/:id', component: User } ] html路由跳转: <router- ...

  8. vue之vue-router嵌套路由

    1.定义路由 routes: [ { path: '/product', //第一层路由 name: 'product', component: Vproductcontent,//父组件渲染的是子组 ...

  9. vue学习记录④(路由传参)

    通过上篇文章对路由的工作原理有了基本的了解,现在我们一起来学习路由是如何传递参数的,也就是带参数的跳转. 带参数的跳转,一般是两种方式: ①.a标签直接跳转. ②点击按钮,触发函数跳转. 在上篇文章中 ...

随机推荐

  1. XXX on tree

    %了发树上莫队 nlognsqrt(n) // luogu-judger-enable-o2 #include<bits/stdc++.h> using namespace std; in ...

  2. [CEOI2018]Global warming

    [CEOI2018]Global warming 题目大意: 给定\(n(n\le2\times10^5)\),你可以将任意\(a_{l\sim r}(1\le l\le r\le n)\)每一个元素 ...

  3. Timer triggered DMA transfer - Delay between requesting the DMA transfer

    Hello, I'm working with a STM32F407 controller board.   Right now, I want to trigger a DMA transfer ...

  4. Javascript Array和String的互转换。

    Array类可以如下定义: var aValues = new Array(); 如果预先知道数组的长度,可以用参数传递长度 var aValues = new Array(20); -------- ...

  5. Google 镜像站搜集

    在特殊的地方和特殊的时间,流畅顺利的打开一个网站也变得如此艰难. 2016.01.16 更新.本站订阅更新功能已上线,欢迎订阅! 以下是直接使用谷歌的方法,如需***戳这里(VPN | Shadows ...

  6. Task.FromResult应用场景举例

    Task.FromResult用来创建一个带返回值的.已完成的Task. 场景一:以同步的方式实现一个异步接口方法 比如有一个接口包含异步方法. interface IMyInterface { Ta ...

  7. 报错:System.NotSupportedException: LINQ to Entities does not recognize the method

    报错:System.NotSupportedException: LINQ to Entities does not recognize the method ...... get_Item(Int3 ...

  8. Android:intent的基础

    只有一个活动的应用也太简单了吧?没错,你的追求应该更高一点.不管你想创建多少 个活动,方法都和上一节中介绍的是一样的.唯一的问题在于,你在启动器中点击应用的图 标只会进入到该应用的主活动,那么怎样才能 ...

  9. DirectInfo.GetFiles返回数组的默认排序

    NTFS和CDFS下,是按照字母顺序,而FAT下,按照文件创建时间顺序 using System; using System.Collections; using System.IO; namespa ...

  10. CATransition 实践

    时间差不够,导致闪屏 CATransition *animation = [CATransition animation]; animation.delegate = self; animation. ...