精华内容
下载资源
问答
  • 写项目的时候 需要把App.vue里面获取到的openid传递给loginid 搜了一下解决方法 可以使用VUEX 以及父子组件之间传值 但是感觉只需要传递一个参数不需要那么麻烦 所以直接 在route里把参数一起传过去 代码如下 APP....

    写项目的时候 需要把App.vue里面获取到的openid传递给loginid
    搜了一下解决方法
    可以使用VUEX
    以及父子组件之间传值
    但是感觉只需要传递一个参数不需要那么麻烦
    所以直接 在route里把参数一起传过去

    代码如下
    APP.VUE中

    this.$router.push({name:'login',params: {openid:toro}});

    然后就在login.vue里面取用toro

     this.user.openid=this.$route.params.openid
    展开全文
  • vue路由跳转携带参数

    2018-12-10 17:10:52
    vue路由跳转携带参数 在使用this.$router.push传递参数的时候有一个坑就是不能用path,用了path后params无效,只能用name来表示路由的路径

    vue路由跳转携带参数

    1.params方式

    在这里插入图片描述
    在使用this.$router.push传递参数的时候有一个坑就是不能用path,用了path后params无效,只能用name来表示路由的路径
    其他vue中使用传来的参数使用 this.$route.params.username 取值

    2.query方式

    在这里插入图片描述
    这种方式只能用path路由

    两者区别

    上网搜索了下主要区别有两个:
    在这里插入图片描述

    展开全文
  • vue页面跳转携带参数

    千次阅读 2018-09-13 17:31:30
    import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld' import home from '@/components/home/home' Vue.use(Router) export default new Router({ ...

    路由设置:

    import Vue from 'vue'
    import Router from 'vue-router'
    import HelloWorld from '@/components/HelloWorld'
    import home from '@/components/home/home'
    
    
    Vue.use(Router)
    
    export default new Router({
      routes: [{
          path: '/',
          name: 'HelloWorld',
          component: HelloWorld
        },
        //我的
        {
          path: '/home',
          name: 'home',
          component: home
        }
      ]
    })
    

     

    1.

    <router-link :to="{name:'home',params:{id:'1'}}">
          <div>跳转</div>
    </router-link>
    
    
    
    <router-link :to="/home?id=1">
          <div>跳转</div>
    </router-link>

    2.

    <h2 @click="fun()">到我的</h2>
    
    //js
    fun(){
        //this.$router.push({ path: "/home", params: { id: "1" } });
        //设置了path跳转的话 parmas不生效
        //this.$router.push({ path: "/home", query: { id: "1" } });
        //this.$router.push({ name:'home', params: { id: "1" } });
        //this.$router.push({ path: '/home?id=' + 1});
      }

     

     

    接收参数:

    created() {
    
    console.log(this.$route.params.id)
    console.log(this.$route.query.id)
    
    },

     

    that.$router.go(-1);

    1. this.$router.replace() (用法同上,push)
    2. this.$router.go(n) ()
    展开全文
  • vue跳转页面携带参数

    万次阅读 2019-04-22 16:09:08
    2017年的时候使用Vue2.0做过一个系统,之后一直就在做JQuery,巩固了基础和数据库、java 的知识。2019年4月份开始用vue2.x来写,vue的基础的东西还是需要记录一下的。 页面跳转: ...不携带参数直接...

    2017年的时候使用Vue2.0做过一个系统,之后一直就在做JQuery,巩固了基础和数据库、java 的知识。2019年4月份开始用vue2.x来写,vue的基础的东西还是需要记录一下的。
    页面跳转:
    HTML:

    <span @click="addGoods" class="addGoods">新增进件</span>
    

    Script – methods :
    不携带参数直接跳转:

     this.$router.push({
                path: '/datainputprogress'
              })
    

    携带参数:

    var ordercode = this.tbodyArr[index].ordercode ;
                var shopname = this.tbodyArr[index].shopname ;
                var branchname = this.tbodyArr[index].branchname ;
                this.$router.push({
                    path: '/datainputprogress',
                    query: {
                      ordercode: ordercode,
                      shopname:shopname,
                      branchname:branchname
                    }
                  })
     ***跳转后获取参数:***
     
     **方法一:**
     //获取地址栏信息
    function getSearchString(key) {
        // 获取URL中?之后的字符
        var addrstr = location.href;
        var str = addrstr.substring(addrstr.lastIndexOf("?") + 1, addrstr.length); //shopcode=125806649&branchcode=001&recommendid=6&openidfrom=&awardto=1001
    
        // 以&分隔字符串,获得类似name=xiaoli这样的元素数组
        var arr = str.split("&");
        var obj = new Object();
    
        // 将每一个数组元素以=分隔并赋给obj对象
        for (var i = 0; i < arr.length; i++) {
            var tmp_arr = arr[i].split("=");
            obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]);
        }
        return obj[key] || '';
    }
    在created中:
    created(){
    	 this.ordercode = api.getSearchString('ordercode');
    }
    **方法二:**
    toMallInfo: function(mallCode){
        this.$router.push({
          path: '/propertyInfo/mall/mallList',
          // name: 'mallList',
          query: {
            mallCode: 'M000989'
          }
        })
      },
    
        created(){
          	this.getParams()
        },
    	methods :{
    		getParams(){
    	            // 取到路由带过来的参数
    	            const routerParams = this.$route.query.mallCode
    	            // 将数据放在当前组件的数据内
    	            this.mallInfo.searchMap.mallCode = routerParams;
    	            this.keyupMallName()
          }
        },
        watch: {
          '$route': 'getParams'
        }
    
    展开全文
  • Vue 跳转页面携带参数

    2020-01-09 21:34:35
    方法里面写上这个, this.$router.push( {path: '/路径',query:{ id:'xiaomign' }}) 点击事件实现跳转携带参数,在跳转后使用下面代码接受参数 this.$route.query.id ...
  • vuerouter携带参数跳转 this.$router.push({path:’/121’,query:{id:id}}) 跳转的页面获取参数 let id=this.$route.query.id 返回上一个页面 this.$router.go(-1)
  • vue如何携带参数跳转

    2021-07-10 17:21:28
    vue如何携带参数跳转 一、图片跳转: 映射路由 <router-link :to="'/face?facesetid=' + item.facesetid"> "../../assets/image/face.jpg" alt="人物"> 注意::to="’/face?facesetid=’ + item.facesetid"中to前面...
  • vue跳转携带参数并打开新的窗口 // An highlighted block let routeUrl = this.$router.resolve({ path:'/OrderReport', name:'OrderReport', query:{ orderNo: e.no } }) window.open(routeUrl.href, '_...
  • vue携带参数跳转到另外一个界面
  • 1、vue页面 ... <...</web-view> //hbuilder中使用web-view <...</iframe>...2、vue页面向html页面传参时需要加密(参数直接在路径后面用问号带过去): this.html = '../../static/html/video.h
  • 1.首先定义跳转函数 这个是链接跳转 <a href="javascript:void(0)" onclick="openPage()">位移变化趋势图</a></td></tr> </table> methods: { openPage(){ // this.$router....
  • 1.需求: ...a标签中添加跳转函数 <a class="orderBtn1 sIRicon2" href="javascript:void(0);" @click="toMallInfo('M000989')"><i class="sIRicon"></i>商场</a> ...
  • 关于VUE路由跳转携带多个参数二次跳转参数失效问题解决 问题: 当A路由点击按钮携带参数跳转到B路由时,第一次传过来的参数有效,但是第二次传过来的参数无效,实质上参数是已经传过来了,只是未被监听到 解决方案:...
  • vue携带参数跳转页面

    2021-09-15 16:25:48
    path放要跳转地址(具体可以去看index.js),query里面放参数名和要携带参数参数名(UserId,UserPhone,Price)要在data里面定义。注意:path要与query一起用。 接收页面: 方法二 name,params 地址栏没有...
  • 最近公司项目重构,前后端分离,主后端开发的我依然逃不过写前端的命运(说好的前后端分离呢)使用Vue的时候遇到了跳转页面的问题 进入正题 不带参跳转 ...有的时候需要携带参数,实现如下 this.$router...
  • //这里使用name进行路由的跳转携带参数时用params,跳转后,url上不会出现参数,刷新页面后参数会丢失 this.$router.push({ name: "page1", params: { code: this.code }, }); //接收参数时用 this.$route....
  • vue页面跳转-携带参数

    2019-05-16 15:17:00
    vue页面跳转-携带参数 1.第一种 <router-link to='/trip'></router-link> <router-link to="/miniCard/statement/horizon"> <button class="btn btn-default">点击跳转</button>...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 4,764
精华内容 1,905
关键字:

vue跳转携带参数

vue 订阅