Tham số truy vấn Vue.js

Question

Làm cách nào để tìm nạp tham số truy vấn trong vue.js?

http:://somesite.com?test=yay 

Không thể tìm cách tìm nạp hoặc tôi cần sử dụng JS thuần túy hoặc một số thư viện cho điều này?

Answer 1

Theo tài liệu của route object, bạn có quyền truy cập vào đối tượng $route từ các thành phần của mình, để hiển thị những gì bạn cần. Trong trường hợp này

//from your component 
console.log(this.$route.query.test) // outputs 'yay' 

Answer 2

Câu trả lời chi tiết hơn để giúp người mới sử dụng VueJ.

<script src="https://unpkg.com/vue-router"></script> 
var router = new VueRouter({ 
    mode: 'history', 
    routes: [] 
}); 
var vm = new Vue({ 
    router, 
    el: '#app', 
    mounted: function() { 
     q = this.$route.query.q 
     console.log(q) 
    }, 
}); 

Answer 3

Without vue-tuyến đường, chia URL

var vm = new Vue({ 
    .... 
    created() 
    { 
    let uri = window.location.href.split('?'); 
    if (uri.length == 2) 
    { 
     let vars = uri[1].split('&'); 
     let getVars = {}; 
     let tmp = ''; 
     vars.forEach(function(v){ 
     tmp = v.split('='); 
     if(tmp.length == 2) 
     getVars[tmp[0]] = tmp[1]; 
     }); 
     console.log(getVars); 
     // do 
    } 
    }, 
    updated(){ 
    }, 

Một giải pháp https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/search:

var vm = new Vue({ 
    .... 
    created() 
    { 
    let uri = window.location.search.substring(1); 
    let params = new URLSearchParams(uri); 
    console.log(params.get("var_name")); 
    }, 
    updated(){ 
    },