How can I get the current route's name in vue.js?

Question

I want to use the current route's name in a v-if statement in a a template. I have read that there is a complicated 3rd party way, but I want something better.

<template v-if="$this.routes.getName() == '/customers'"> 

Answer 1

if you register the route with a name then it's too simple

Your route

{
 name: 'Foo',
 path: '/foo'
 component: 'Foo.vue'
}

Then it's just

this.$route.name

And it will return Foo

You can compare with name, however if you want to compare with path then

this.$route.path // it will return exact path after domain i.e. www.google.com/foo
if(this.$route.path === '/foo') {
  console.log('I am on foo route')
}

Try loggin your route object and explore what else you have

console.log(this.$route)