Redux: рдорд┐рдбрд▓рд╡реЗрдпрд░ рдХреЗ рд╕рд╛рде рд╣реЛрдиреЗ рд╡рд╛рд▓реА рдЕрдирдВрдд рдкреБрдирд░рд╛рд╡реГрддреНрддрд┐

рдХреЛ рдирд┐рд░реНрдорд┐рдд 1 рдЕрдкреНрд░реИрд▓ 2016  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: reduxjs/redux

рдореИрдВ рдПрдХ рд╡реЗрдмрдк рдкрд░ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдЬреЛ Redux рдХреЗ рд╕рд╛рде рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реИред рдореИрдВрдиреЗ Redux-thunk Github рдореЗрдВ рдПрдХ рд╕рдорд╛рди рд╕рдВрджреЗрд╢ рдкреЛрд╕реНрдЯ рдХрд┐рдпрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рд╕рдВрднрд╡рддрдГ Redux рдорд┐рдбрд▓рд╡реЗрдпрд░ рдХреЗ рд╕рд╛рде рдПрдХ рдЕрдзрд┐рдХ рд╕рд╛рдорд╛рдиреНрдп рдореБрджреНрджрд╛ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдореИрдВ рд╡рд░реНрддрдорд╛рди рдореЗрдВ Redux-Thunk рдХрд╛ рдЙрдкрдпреЛрдЧ рдЗрд╕ рддрд░рд╣ рд╕реЗ рдХрд░ рд░рд╣рд╛ рд╣реВрдБ, рдЬреЛ рдпрд╣рд╛рдБ рдкрд╛рдП рдЧрдП рдЙрджрд╛рд╣рд░рдг рдХреЗ рд╕рдорд╛рди рд╣реИ:
http://redux.js.org/docs/advanced/ExampleRedditAPI.html

рдЕрдкрдирд╛ рдРрдк рдЪрд▓рд╛рддреЗ рд╕рдордп, рдореБрдЭреЗ Chrome рдореЗрдВ рдирд┐рдореНрди рддреНрд░реБрдЯрд┐ рджрд┐рдЦрд╛рдИ рджреЗрддреА рд╣реИ:

Uncaught RangeError: Maximum call stack size exceeded
(anonymous function) @ index.js:10
dispatch @ applyMiddleware.js:44
(anonymous function) @ index.js:12
dispatch @ applyMiddleware.js:44
(anonymous function) @ index.js:12
dispatch @ applyMiddleware.js:44
(anonymous function) @ index.js:12
dispatch @ applyMiddleware.js:44

рдпрд╣рд╛рдБ рдореЗрд░реА рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рд▓рд┐рдП рдПрдХ рдХрдбрд╝реА рд╣реИ:
https://github.com/jbri7357/redux-sample-app

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдореБрджреНрджрд╛ рдпрд╣рд╛рдБ рд╣реИ :

const mapDispatchToProps = (dispatch) => {
  return dispatch;
}

рдЬреИрд╕реЗ mapStateToProps , mapDispatchToProps рдкреНрд░реЙрдкреНрд╕ рдХреЗ рд╕рд╛рде рдХрд┐рд╕реА рдСрдмреНрдЬреЗрдХреНрдЯ рдХреЛ рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рд╣реИред

рдпрджрд┐ рдЖрдк рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдХреА рдЖрдкреВрд░реНрддрд┐ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ connect() рдЙрд╕ рдлрд╝рдВрдХреНрд╢рди рдХреЛ рдПрдХ рд╡рд┐рд╢рд┐рд╖реНрдЯ-рд╡рд┐рд╢рд┐рд╖реНрдЯ mapDispatchToProps() рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреЙрд▓ рдХрд░реЗрдЧрд╛ (рдпрд╣ рдкреНрд░рддрд┐-рдЖрд╡реГрддреНрддрд┐ рдЬреНрдЮрд╛рдкрди рдХреЗ рд▓рд┐рдП рдЙрдкрдпреЛрдЧреА рд╣реИ)ред рд╣рд╛рд▓рд╛рдВрдХрд┐ рдпрд╣ рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛ рдХреЗ рд▓рд┐рдП рдкреНрд░рд╛рд╕рдВрдЧрд┐рдХ рдирд╣реАрдВ рд╣реИред

рдЖрдкрдХреЗ рдорд╛рдорд▓реЗ рдореЗрдВ, рдЖрдкрдХреЛ dispatch (рдПрдХ рдлрд╝рдВрдХреНрд╢рди) рдХреЗ рдмрдЬрд╛рдп {dispatch} (рдПрдХ рд╡рд╕реНрддреБ) рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рдерд╛:

const mapDispatchToProps = (dispatch) => {
  // return dispatch;
  return {dispatch};
}

рд╡рд╣ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдареАрдХ рдХрд░ рджреЗрдЧрд╛ред рд╡реИрд╕реЗ, рдпрд╣ _is_ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд╡реНрдпрд╡рд╣рд╛рд░ рдпрджрд┐ рдЖрдк mapDispatchToProps рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рдЖрдк рдЗрд╕реЗ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╣рдЯрд╛ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ рдЗрд╕реЗ connect() рдмрд┐рд▓рдХреБрд▓ рднреА рдкрд╛рд╕ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗред

рдореИрдВ рдЗрд╕ рдЙрдореНрдореАрдж рдореЗрдВ рд╣реВрдБ рдХреА рдЗрд╕рд╕реЗ рдорджрдж рдорд┐рд▓реЗрдЧреА!

рд╕рднреА 3 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдореИрдВ рдХрд╣реВрдВрдЧрд╛ рдХрд┐ рдЙрдирдХреЗ рдЙрдкрдпреЛрдЧ рдХреЗ рд╕реНрддрд░ рдХреЛ рджреЗрдЦрддреЗ рд╣реБрдП, рдпрд╣ Redux рдпрд╛ Redux Thunk рдХреЗ рд╕рд╛рде рдПрдХ рдореБрджреНрджрд╛ рд╣реЛрдиреЗ рдХреА рд╕рдВрднрд╛рд╡рдирд╛ рдирд╣реАрдВ рд╣реИ, рдФрд░ рдПрдкреНрд▓рд┐рдХреЗрд╢рди рдХреЗ рдХреЛрдб рдореЗрдВ рдПрдХ рд╕реВрдХреНрд╖реНрдо рдЧрд▓рддреА рд╣реЛрдиреЗ рдХреА рдЕрдзрд┐рдХ рд╕рдВрднрд╛рд╡рдирд╛ рд╣реИред

рдЕрдХреЗрд▓реЗ рд╕реНрд░реЛрдд рд╕реЗ рдирд┐рджрд╛рди рдХрд░рдирд╛ рдХрдард┐рди рд╣реИред рдпрджрд┐ рдЖрдк рд╕рдорд╕реНрдпрд╛ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рд╡рд╛рд▓реА рдПрдХ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдкреНрд░рдХрд╛рд╢рд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рддреЛ рдпрд╣ рдЙрдкрдпреЛрдЧреА рд╣реЛрдЧрд╛ред

рдореБрджреНрджрд╛ рдпрд╣рд╛рдБ рд╣реИ :

const mapDispatchToProps = (dispatch) => {
  return dispatch;
}

рдЬреИрд╕реЗ mapStateToProps , mapDispatchToProps рдкреНрд░реЙрдкреНрд╕ рдХреЗ рд╕рд╛рде рдХрд┐рд╕реА рдСрдмреНрдЬреЗрдХреНрдЯ рдХреЛ рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рд╣реИред

рдпрджрд┐ рдЖрдк рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдХреА рдЖрдкреВрд░реНрддрд┐ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ connect() рдЙрд╕ рдлрд╝рдВрдХреНрд╢рди рдХреЛ рдПрдХ рд╡рд┐рд╢рд┐рд╖реНрдЯ-рд╡рд┐рд╢рд┐рд╖реНрдЯ mapDispatchToProps() рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреЙрд▓ рдХрд░реЗрдЧрд╛ (рдпрд╣ рдкреНрд░рддрд┐-рдЖрд╡реГрддреНрддрд┐ рдЬреНрдЮрд╛рдкрди рдХреЗ рд▓рд┐рдП рдЙрдкрдпреЛрдЧреА рд╣реИ)ред рд╣рд╛рд▓рд╛рдВрдХрд┐ рдпрд╣ рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛ рдХреЗ рд▓рд┐рдП рдкреНрд░рд╛рд╕рдВрдЧрд┐рдХ рдирд╣реАрдВ рд╣реИред

рдЖрдкрдХреЗ рдорд╛рдорд▓реЗ рдореЗрдВ, рдЖрдкрдХреЛ dispatch (рдПрдХ рдлрд╝рдВрдХреНрд╢рди) рдХреЗ рдмрдЬрд╛рдп {dispatch} (рдПрдХ рд╡рд╕реНрддреБ) рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рдерд╛:

const mapDispatchToProps = (dispatch) => {
  // return dispatch;
  return {dispatch};
}

рд╡рд╣ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдареАрдХ рдХрд░ рджреЗрдЧрд╛ред рд╡реИрд╕реЗ, рдпрд╣ _is_ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд╡реНрдпрд╡рд╣рд╛рд░ рдпрджрд┐ рдЖрдк mapDispatchToProps рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рдЖрдк рдЗрд╕реЗ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╣рдЯрд╛ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ рдЗрд╕реЗ connect() рдмрд┐рд▓рдХреБрд▓ рднреА рдкрд╛рд╕ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗред

рдореИрдВ рдЗрд╕ рдЙрдореНрдореАрдж рдореЗрдВ рд╣реВрдБ рдХреА рдЗрд╕рд╕реЗ рдорджрдж рдорд┐рд▓реЗрдЧреА!

рдЗрд╕ рдХреЗ рд╕рд╛рде рдЖрдкрдХреА рдорджрдж рдФрд░ рдЖрдкрдХреЗ рджреНрд╡рд╛рд░рд╛ рдкреНрд░рджрд╛рди рдХреА рдЧрдИ рдкреВрд░реА рдЬрд╛рдирдХрд╛рд░реА рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рдж!

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

amorphius picture amorphius  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

CellOcean picture CellOcean  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

vslinko picture vslinko  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

cloudfroster picture cloudfroster  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

timdorr picture timdorr  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ