带有 webpack 的 Vue-router 无法访问$route

Question

<template>
<div>
    {{$route.params}}
    <button v-on:click="test">dasda</button>
</div>
</template>
<script>
export default{
    methods: {
        test: () => {
        var test = this.$route;
           console.dir(test);
        }
    },
    created: () => {
    console.log(this.$route);
   }
}
</script>

i可以在绑定中访问$route，将显示正确的参数，但是如果我尝试访问$route对象，则不确定。我正在使用WebPack，并且使用Vuejs DevTools找到了$route对象，但我不知道如何访问它。如果我直接打印$route对象，它也将不确定。

Answer 1

请勿在组件上使用箭头功能。他们必须绑定到组件的上下文。

而是使用正确的方法：

export default {
    methods: {
        test () {
            var test = this.$route;
            console.dir(test);
        },
    },
    created () {
        console.log(this.$route);
    },
};