Skip to content

Commit fb67b53

Browse files
msksaulmsksaul
committed
feature/context
1 parent 4af9b2c commit fb67b53

4 files changed

Lines changed: 51 additions & 4 deletions

File tree

‎src/App.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
11
import React from 'react';
22
import Navigation from './components/Navigation'
3+
import AuthContextProvider from './contexts/AuthContext';
4+
import Prueba from './components/Prueba';
35

46
function App() {
57
return (
68
<React.Fragment>
7-
<Navigation/>
8-
<h1>Hola Mundo</h1>
9+
<AuthContextProvider>
10+
<Navigation/>
11+
<h1>Hola Mundo</h1>
12+
<Prueba />
13+
</AuthContextProvider>
914
</React.Fragment>
1015
);
1116
}

‎src/components/Navigation/index.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import React, { useState } from 'react';
1+
import React, { useState, useContext } from 'react';
2+
import { AuthContext } from '../../contexts/AuthContext'
3+
24
import {
35
Collapse,
46
Navbar,
@@ -16,6 +18,7 @@ import {
1618

1719
const Navigation = (props) => {
1820
const [isOpen, setIsOpen] = useState(false);
21+
const {token} = useContext(AuthContext);
1922

2023
const toggle = () => setIsOpen(!isOpen);
2124

@@ -50,7 +53,7 @@ const Navigation = (props) => {
5053
</DropdownMenu>
5154
</UncontrolledDropdown>
5255
</Nav>
53-
<NavbarText>Simple Text</NavbarText>
56+
<NavbarText>{token}</NavbarText>
5457
</Collapse>
5558
</Navbar>
5659
</div>

‎src/components/Prueba/index.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import React, { useContext } from "react";
2+
import { AuthContext } from '../../contexts/AuthContext';
3+
4+
const Prueba = () => {
5+
const {token, setToken} = useContext(AuthContext);
6+
return (
7+
<React.Fragment>
8+
<h2>El contenido del token es: { token } </h2>
9+
<input type="text" onChange={ (e) => setToken(e.target.value) } />
10+
</React.Fragment>
11+
);
12+
}
13+
14+
export default Prueba;

‎src/contexts/AuthContext.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import React, { createContext, useState } from 'react';
2+
3+
export const AuthContext = createContext();
4+
5+
const AuthContextProvider = (props) => {
6+
const [token, setToken] = useState('');
7+
8+
return (
9+
<AuthContext.Provider value={{
10+
token, setToken
11+
}}>
12+
{ props.children }
13+
</AuthContext.Provider>
14+
)
15+
};
16+
17+
export default AuthContextProvider;
18+
19+
/*
20+
<Proveedor>
21+
<Navbar>
22+
<Body>
23+
<Footer>
24+
<Proveedor>
25+
*/

0 commit comments

Comments
 (0)