美文网首页
vue传参的几种方式

vue传参的几种方式

作者: 求喜欢 | 来源:发表于2021-02-05 16:58 被阅读0次
1.path+params
this.$router.push(`/detail/${id}`)

路由配置

{
     path: '/detail/:id',
     name: 'detail',
     component: Detail
   }

获取参数

this.$route.params.id
2.path+query(类似于get请求,url后会拼上参数)
 this.$router.push({
          path: '/detail',
          query: {
            id: id
          }
 })

获取参数

this.$route.query.id
3.name+params(类似于post请求,url后没有参数,前两种方式刷新页面不会丢参,该方式会丢参)
 this.$router.push({
          name: 'Detail',
          params: {
            id: id
          }
 })

获取参数

this.$route.params.id

相关文章

  • Vue-Router

    1. 路由配置 默认路由跳转 在 new Router时可用的配置参数: 2.路由传参 Vue路由传参的几种方式 ...

  • vue传参的几种方式

    1.path+params 路由配置 获取参数 2.path+query(类似于get请求,url后会拼上参数) ...

  • 几种vue的组件传值方式

    几种vue的组件传值方式 1、路由传参 ①定义路由时加上参数props: true,在定义路由路径时要留有参数占位...

  • vue路由传参的几种方式

    完整步骤 下面对以上方法进行扩展 对步骤一扩展还可以这么写 params相当于post可以在地址栏看到路由传的参数...

  • Vue路由传参的几种方式

    https://www.cnblogs.com/luguankun/p/10843783.html https:/...

  • vue 路由传参的几种方式

    编程式路由传参 除了使用 创建 a 标签来定义导航链接,我们还可以借助 router ...

  • 前端与后台交互的方式

    前台向后台传参,一般有如下几种方式:1)URL方式传参这种方式传参时,首个参数置于url的后面,用“?”连接;形式...

  • vue - 路由带参跳转

    vue路由传参按照传参方式可划分为params传参和query传参; params传参分为在url中显示和影藏参数...

  • vue 路由传参的三种方式

    vue路由传参方式 params query vuex + sessionStore

  • vue-router

    vue传参两种方式 1、对象传参2、路径传参 vue路由两种模式 1、hash模式 onhashchange2、h...

网友评论

      本文标题:vue传参的几种方式

      本文链接:https://www.haomeiwen.com/subject/vekgtltx.html