11# vue-body-class
2- Control your page body classes with vue-router easily
2+
3+ Control your page body classes with vue-router easily:
4+
5+ + add classes to parent and children routes
6+ + add classes for homepage (v.2)
7+ + overwrite classes defined in parent routes
8+ + dynamic routes support
39
410The package uses ES6, so read [ this] ( https://github.com/nikolaynesov/vue-body-class/issues/1 ) if you are facing with ` Unexpected token ` issue.
511
612## Dependencies
7- vue.js 2.x
8- vue-router 2.x
13+ + vue.js 2.x
14+ + vue-router 2.x
915
1016## Installation
1117
12- npm install vue-body-class --save
18+ ` npm install vue-body-class --save `
1319
1420## Get started
1521
22+ ``` js
23+ import vbclass from ' vue-body-class'
24+ Vue .use ( vbclass, router )
25+ ```
26+
27+ ##### If you are using ` v.1 ` :
1628``` js
1729import vbclass from ' vue-body-class'
1830Vue .use ( vbclass, { router } )
@@ -29,7 +41,7 @@ meta: { bodyClass: 'dashboard' },
2941...
3042```
3143
32- NOTE! for ` v.1 ` use ` bodyClass ` right inside the route object:
44+ ##### For ` v.1 ` use ` bodyClass ` right inside the route object:
3345
3446``` js
3547name: ' dashboard' ,
@@ -65,7 +77,7 @@ will result in
6577class = 'dashboard profile'
6678```
6779
68- You can overwrite parent classes by adding '!' at the beginning of the class:
80+ You can overwrite parent classes by adding ` ! ` at the beginning of the class:
6981``` js
7082name: ' dashboard' ,
7183path: ' /dashboard' ,
@@ -102,6 +114,6 @@ will result in
102114class = 'profile personal'
103115```
104116
105- as ' !profile' overwrites ' dashboard' class.
117+ as ` !profile ` overwrites ` dashboard ` class.
106118
107119The plugin will save your original body classes and new classes will be appended.
0 commit comments