$ vue js組件中的$ route只返回undefined

我試圖從varn組件中將參數從url轉換爲方法。

我讀過，我打算用這個。$ route但不管我做什麼都返回undefined，我已經看到了幾個不同的類似問題，但他們的修復程序沒有爲我工作。

<template> 
    {{ this.$route.query }} 
</template> 
<script> 
    export default { 
    name: 'cards', 
    data:() => ({ 
     items: [ 
     { 
      id: 1, 
      title: '8 myths about mobile interfaces', 
      link: 'https://medium.muz.li/8-myths-about-mobile-interfaces-390d9e2cee33', 
      folder: 'medium', 
      order: 1, 
     }, 
     { 
      id: 2, 
      title: 'Asking your user’s gender, the new skeuomorphism, upside-down UIs and more', 
      link: 'https://uxdesign.cc/asking-your-users-gender-the-new-skeuomorphism-upside-down-uis-and-more-e108ef888030', 
      folder: 'medium', 
      order: 2, 
     }, 
     ], 
    }), 
    methods: { 
     link:() => { 
     console.log(this.$routes.query); 
     }, 
    }, 
    }; 
</script>

我在模板中使用了這個$ route，它工作正常並顯示它。

我不確定我需要做什麼才能顯示參數。

我是新vue所以可能會做整個過程錯誤，但基本上應用程序將讀取鏈接，只顯示文件夾內容，所以如果它的網址是/卡？文件夾=中，它只會顯示數據與文件夾數據。所以，如果你知道更好的方式，只需告訴我！

否則你能看到爲什麼它沒有顯示路線？

這裏是我的路由器VUE文件，如果有幫助：

import Vue from 'vue'; 
import VueRouter from 'vue-router'; 

import cards from './cards/cards'; 

Vue.use(VueRouter); 

export default new VueRouter({ 
    routes: [ 
    { 
     path: '/cards', 
     name: 'cards', 
     component: cards, 
    }, 
    ], 
    mode: 'history', 
});

來源

2017-05-14 Josh Batley

可能重複[VueJS：爲什麼是「this」undefined？]（http://stackoverflow.com/questions/43929650/vuejs-why-is-this-undefined） – thanksd

爲了訪問this你不應該使用箭頭功能。使用常規功能來代替：

methods: { 
    links: function() { 
    console.log(this.$route) // should work 
    } 
}

這在Vue公司的文檔說明，例如這裏https://vuejs.org/v2/api/#data底注。

來源

2017-05-14 19:11:28 wostex

經驗教訓。感謝你的回答！ – Renesansz

$ vue js組件中的$ route只返回undefined

回答

相關問題