专栏首页python-爬虫Vue-cli中的跳转

Vue-cli中的跳转

Vue-cli中的跳转

一.页面中跳转指定网页

写法一:

<router-link :to="{name:'home'}"> 

这里的name是在VUE路由里面的

写法二:

<router-link :to="{path:'/path'}"> 

注意:router-link中链接如果是'/'开始就是从根路由开始,如果开始不带'/',则从当前路由开始。

二.js中跳转

push与replace用法一样,都是跳转到指定网页

区别:

  • push会history栈中添加一个记录,点击后退会返回到上一个页面
  • replacehistory栈中不会有记录,点击返回会跳转到上上个页面
this.$router.push('/path') 
this.$router.push({name:'name'}) 
this.$router.push({path:'/path'})

三.返回

向前或者向后跳转n个页面,n可为正整数或负整数

this.$router.go(n)

四.关于跳转传参

页面

<router-link :to="{name:'name', params: {id:1}}"> 
// params传参数 (类似post)
// 路由配置 path: "/path/:id" 或者 path: "/path:id" 
// 不配置path ,第一次可请求,刷新页面id会消失
// 配置path,刷新页面id会保留
    
<router-link :to="{name:'name', query: {id:1}}"> 
 
// query传参数 (类似get,url后面会显示参数)
// 路由可不配置
 
// html 取参  $route.query.id
// script 取参  this.$route.query.id

js中

this.$router.push(或者replace)({name:'name',query: {id:'1'}}) //这里name和path都可以
this.$router.push(或者replace)({name:'name',params: {id:'1'}})  // 只能用 name
 
// 路由配置 path: "/path/:id" 或者 path: "/path:id" ,
// 不配置path ,第一次可请求,刷新页面id会消失
// 配置path,刷新页面id会保留
 
// html 取参  $route.params.id
// js 取参  this.$route.params.id

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • jwt认证生成后的token后端解析

    {'authorization':token的值',Content-Type':application/json}

    小小咸鱼YwY
  • os模块,sys模块

    当终端 python test.py 参数1 参数2 ... 执行python文件的时候会接收参数

    小小咸鱼YwY
  • Go-for循环

    小小咸鱼YwY
  • vue --- 路由传参的几种方式

    很显然,需要在path中添加/:id来对应 $router.push 中path携带的参数。在子组件中可以使用来获取传递的参数值。

    小蔚
  • vue.js路由传参

    章鱼喵
  • 使用React做同构应用

    React是用于开发数据不断变化的大型应用程序的前端view框架,结合其他轮子例如redux和react-router就可以开发大型的前端应用。

    frontoldman
  • Spark云服务进展 (Databricks Runtime 3.0)

    Databricks是spark商业孵化公司,主要做的工作是在AWS上提供SaaS化的spark服务。最近在databricks博客上公布了做的一些有意思的进展...

    大数据和云计算技术
  • Java项目启动时执行指定方法的几种方式

    上方就是@PostConstruct注解的使用方法了,同时也表示了此类被加载时的执行顺序。

    Java学习录
  • php进程通信-PIPE管道通信

    通俗来讲,就是A进程在1.txt写入1,B进程读取1.txt,就能读取到这个1,这样就通信成功了.

    仙士可
  • 10分钟教你用python如何正确把妹-不知道妹子为何生气?那是因为你没学python

    当然啦,这只是测试版的效果,真正的版本可比这个厉害多啦。不过作为一个直男,另一个男的给小编发这个测试感觉还是有点怪怪的哈。

    短短的路走走停停

扫码关注云+社区

领取腾讯云代金券