Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
R
redux-practice
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Sumaiyya Burney
redux-practice
Commits
d3beae3a
Commit
d3beae3a
authored
May 03, 2021
by
Sumaiyya Burney
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Adds counter
parent
95f2cead
Changes
4
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
41 additions
and
6 deletions
+41
-6
index.js
src/actions/index.js
+18
-0
Button.js
src/containers/Button.js
+11
-4
index.js
src/index.js
+2
-1
index.js
src/reducers/index.js
+10
-1
No files found.
src/actions/index.js
View file @
d3beae3a
...
...
@@ -6,3 +6,21 @@
export
const
sayHello
=
()
=>
({
type
:
"HELLO_REACT"
})
export
const
globalInc
=
()
=>
({
type
:
"GLOBAL_INCREMENT"
})
export
const
globalDec
=
()
=>
({
type
:
"GLOBAL_DECREMENT"
})
export
const
addToCart
=
(
selectedSku
)
=>
({
type
:
"ADD_TO_CART"
,
selectedSku
:
selectedSku
})
export
const
removeFromCart
=
(
selectedSku
)
=>
({
type
:
"REMOVE_FROM_CART"
,
selectedSku
:
selectedSku
})
\ No newline at end of file
src/containers/Button.js
View file @
d3beae3a
import
React
from
'react'
import
{
connect
}
from
'react-redux'
import
{
sayHello
}
from
'../actions'
import
{
globalDec
,
globalInc
,
sayHello
}
from
'../actions'
let
Button
=
({
whatsUp
,
stateObject
,
saySomething
})
=>
(
let
Button
=
({
whatsUp
,
stateObject
,
saySomething
,
globalIncrement
,
globalDecrement
,
count
})
=>
(
<
div
>
<
button
onClick
=
{
saySomething
}
>
PRESS
TO
DISPATCH
FIRST
ACTION
<
/button
>
<
h2
>
{
whatsUp
}
<
/h2
>
<
button
onClick
=
{()
=>
console
.
log
(
'Redux State:'
,
stateObject
)}
>
Press
to
inspect
STATE
in
console
panel
<
/button
>
<
h2
>
{
count
}
<
/h2
>
<
button
onClick
=
{
globalIncrement
}
>
Increment
<
/button
>
<
button
onClick
=
{
globalDecrement
}
>
Decrement
<
/button
>
<
/div
>
)
const
mapStateToProps
=
(
state
)
=>
({
whatsUp
:
state
.
say
,
stateObject
:
state
stateObject
:
state
,
count
:
state
.
count
})
const
mapDispatchToProps
=
(
dispatch
)
=>
({
saySomething
:
()
=>
{
dispatch
(
sayHello
())}
saySomething
:
()
=>
{
dispatch
(
sayHello
())},
globalIncrement
:
()
=>
{
dispatch
(
globalInc
())},
globalDecrement
:
()
=>
{
dispatch
(
globalDec
())}
})
Button
=
connect
(
...
...
src/index.js
View file @
d3beae3a
...
...
@@ -5,8 +5,9 @@ import { Provider } from 'react-redux'
import
reducer
from
'./reducers'
import
'./css/styles.css'
import
App
from
"./components/App"
import
{
composeWithDevTools
}
from
'redux-devtools-extension'
;
const
store
=
createStore
(
reducer
)
const
store
=
createStore
(
reducer
,
window
.
__REDUX_DEVTOOLS_EXTENSION__
&&
window
.
__REDUX_DEVTOOLS_EXTENSION__
()
)
render
(
<
Provider
store
=
{
store
}
>
...
...
src/reducers/index.js
View file @
d3beae3a
const
reducer
=
(
state
=
{},
action
)
=>
{
const
reducer
=
(
state
=
{
count
:
0
,
cart
:
[]
},
action
)
=>
{
switch
(
action
.
type
)
{
case
'HELLO_REACT'
:
return
{
...
state
,
say
:
'Hello World Redux'
};
case
'GLOBAL_INCREMENT'
:
return
{
...
state
,
count
:
state
.
count
+
1
};
case
'GLOBAL_DECREMENT'
:
return
{
...
state
,
count
:
state
.
count
-
1
};
case
'ADD_TO_CART'
:
return
{...
state
,
cart
:
[
state
.
cart
.
concat
(
action
.
selectedSku
)]}
case
'REMOVE_FROM_CART'
:
return
{
...
state
,
cart
:
[...
state
.
cart
.
slice
(
0
,
action
.
selectedSku
),
...
state
.
cart
.
slice
(
action
.
selectedSku
+
1
)]
}
default
:
return
state
;
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment