-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathREADME
42 lines (35 loc) · 1.2 KB
/
README
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
React-SideNav
See a live demo here: https://ianb64.github.io/React-SideNav/
Usage:
1. Clone this repo:
git clone https://github.com/IanB64/React-SideNav.git
2. Go into the repository:
cd React-SideNav
3. To install dependencies:
npm i
4. To start development server:
npm run start
The SideNav component conncects to redux, gets the mainNav and navs from the sidenav reducer.
mainNav - object with keys: label, text, path
example:
{ see mainNavReducer in reducers/sidenav.js }
navs - array of objects, keys: label, text, path, items(optional)
example:
{ see navsReducer in reducers/sidenav.js }
***
NOTE: IMPORTANT!! The path for each item has to follow the hiearchy format. And the label must be the same as the last string in the path.
Usage:
<SideNav />
***
SideNavItem component connects to redux, gets the selectedNav and use selectNav to update the selectedNav
props:
depthStep - set to 10px
depth - initial to be 0, increase by 1 for every level.
item - one of the navs or the mainNav
selectedNav - one of the navs or the mainNav
example:
{
label: 'about-us',
text: 'About Us',
path: '/home/about-us',
}