vue+webpack+vue-cli获取URL地址参数

在没有使用webpack+vue router开发中，想要获取RUL传的参数地址，直接通过一个函数就可以获得。

比如在 www.test.com/test.html?sign=test 地址中，想要获取sign的值，通常的方法是用一个函数，

var getUrlStr = function(name) {
　　var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
　　var r = window.location.search.substr(1).match(reg);
　　if(r != null) return unescape(r[2]);
　　return null;
}

var sign = getUrlStr ("sign")；

sign的值就为 test ；

那么问题来了，用router开发，是直接通过路由跳转的页面，那该怎样获取呢？

首先想到的也是通过以上方法获取，但试了一下，表示行不通。通过百度了解到，可以直接使用提供的方法；

就如这样，也是同样的传参 http://localhost:8080/#/one?sign=nsrjbxx

var sign = this.$route.query.sgin ;

this 指的是 vue 对象，所以放在vue的方法中直接使用就行了，sign 是参数，这个是可以自定义的。

理解很潜，简单的能达到目的，有更深的理解欢迎来评！！！

最近发现可以简单的修改下getUrlStr 函数也是可以实现的

var  getUrlStr = function(name){

        /**

         * 获取地址栏参数

         */

        let reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)","i");

        if(reg.test(window.location.href)){

            return unescape(RegExp.$2.replace(/\+/g," "))

        }

        return undefined

    }

直接通过获取location.href 得到URL的地址，在根据获取参数就ok了！

巴特西

vue+webpack+vue-cli获取URL地址参数

最新文章

热门文章