How to get current route name in Nuxt

To Get Current Nuxt Route Name

Nuxt 2

Now in .vue file, inside the script tag.

                                
                                        <script lang="ts">
import {
  defineComponent,
  useRoute
} from '@nuxtjs/composition-api';

export default defineComponent({
  setup() {
    const route = useRoute();
    // - Assigning route name
    const routeName = route.value.name;

    // !!! Need to return the value
    return {
      routeName
    }
  }
});
</script>
                                    
                            

Inside the Vue template tag.

                                <template>
  <div>
    {{ routeName }}
  </div>
</template>
                            

Nuxt 3

Now in the .vue file, inside script tag.

                                
                                        <script lang="ts" setup>
  const route = useRoute();
  const routeName = route.name;
</script>
                                    
                            

Inside the Vue template tag.

                                <template>
  <div>
    {{ routeName }}
  </div>
</template>
                            

Tags: Nuxt