NUXTJS

  • Docs
  • Examples
  • FAQ
  • Blog
  • Video Courses new

Routing

  • Hello World
  • Active Link Classes
  • Dynamic Pages
  • Nested Pages

Data Fetching

  • asyncData Hook
  • fetch Hook

Asset Management

  • webpack Assets
  • Pre-processors

Transitions

  • Nuxt transitions

SEO

  • SEO HTML Head
  • SEO Twitter and Open Graph

Loading

  • Customize Nuxt Loading
  • Customize Nuxt Loading Indicator
  • Custom Loading Component

Miscellaneous

  • Layouts
  • Lazy Loading Components
  • Vuex Store
  • Nuxt Helpers

Middleware

  • Router Middleware
  • Named Middleware
  • Anonymous Middleware

Plugins

  • Vue Plugins
  • Client Only Plugins
  • External Packages Plugin
  • Custom Plugins

Modules

  • Local Module
  • Axios usage

Version 2.14.8

Routing

  • Hello World
  • Active Link Classes
  • Dynamic Pages
  • Nested Pages

Data Fetching

  • asyncData Hook
  • fetch Hook

Asset Management

  • webpack Assets
  • Pre-processors

Transitions

  • Nuxt transitions

SEO

  • SEO HTML Head
  • SEO Twitter and Open Graph

Loading

  • Customize Nuxt Loading
  • Customize Nuxt Loading Indicator
  • Custom Loading Component

Miscellaneous

  • Layouts
  • Lazy Loading Components
  • Vuex Store
  • Nuxt Helpers

Middleware

  • Router Middleware
  • Named Middleware
  • Anonymous Middleware

Plugins

  • Vue Plugins
  • Client Only Plugins
  • External Packages Plugin
  • Custom Plugins

Modules

  • Local Module
  • Axios usage

Active Link Classes

In this example:

layouts/default.vue shows the styles for nuxt-link-active and nuxt-link-exact-active.

Learn more about vue routers active and exact active classes.

Learn more about active classes in the Features book in the Nuxt Components chapter.

Loading CodeSandbox...
   

Contributors

Debbie O'Brien Debbie O'Brien pooya parsa pooya parsa Sébastien Chopin Sébastien Chopin Alexandre Chopin Alexandre Chopin

NuxtJS Newsletter

Get the latest Nuxt news to your inbox, curated by the NuxtJS team.

Discover

  • Our team
  • Design kit
  • Contact us

Help

  • Resources
  • Chat with us
  • Contribution guide

Support

  • Our Goodies Store
  • Sponsoring & donations
  • Training & consultancy
Deploys by Netlify
Docs Examples FAQ Blog Video Courses