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. python集合相关操作

    集合相关操作 集合是一个无序的,不重复的数据组合,它有着两个主要作用:去重以及关系测试. 去重指的是当把一个列表变成了集合,其中重复的内容就自动的被去掉了 关系测试指的是,测试两组数据之间的交集.差集 ...

  2. NOI.AC NOIP模拟赛 第二场 补记

    NOI.AC NOIP模拟赛 第二场 补记 palindrome 题目大意: 同[CEOI2017]Palindromic Partitions string 同[TC11326]Impossible ...

  3. tomcat 启动 关闭 重启脚本

    启动 #!/bin/bash # Author:wanglan # Mail:@qq.com # Fuction:Tomcat Start/stop/restart script # Version: ...

  4. Codeforces Round #258 (Div. 2) D. Count Good Substrings 水题

    D. Count Good Substrings 题目连接: http://codeforces.com/contest/451/problem/D Description We call a str ...

  5. ios网络请求

    1.AFNetworking object 2.Alamofire swift

  6. logstash高速入口

    原文地址:http://logstash.net/docs/1.4.2/tutorials/getting-started-with-logstash 英语水平有限,假设有错误请各位指正 简单介绍 L ...

  7. Bugzilla Error message: couldn't create child process: 720003: index.cgi

    two steps is try to fix this issue. 1. Turn off the windowns firewall 2. Register the perl to the sy ...

  8. HDU 4453 Looploop (伸展树splay tree)

    Looploop Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  9. mysqltool :dodba orzdba

    http://www.cnblogs.com/beyang/p/6963306.html

  10. 安装oracle10g“程序异常终止。发生内部错误。请将以下文件提供给oracle技术支持部门

    发生情景:测试环境搭建的是windows 2008 r2 sp1系统 在安装Oracle 10g数据库时发生了错误,现在把解决问题的方法和原因分享给大家. *  安装出现的现象: 输入完密码后下一步时 ...