Π ΠΏΡΠΈΠΌΠ΅ΡΠ΅, ΠΎΠΏΠΈΡΠ°Π½Π½ΠΎΠΌ ΠΊΠ°ΠΊ ΡΠ°ΡΡΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ API Π΄Π»Ρ "combReducers", Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° "reducer" Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΏΠ΅ΡΠ΅Π΄Π°Π΅ΡΡΡ Π² createStore Π² ΡΠ°ΠΉΠ»Π΅ " app.js " ( let store = createStore(reducer)
).
ΠΠ΄Π½Π°ΠΊΠΎ Π² Β« reducers / index.js Β» ΠΈΠΌΡ ΡΡΠ½ΠΊΡΠΈΠΈ - Β«combReducersΒ», Π° Π½Π΅ Β«reducerΒ» ( export default combineReducers({..})
).
Π’Π°ΠΊ ΡΡΠΎ Π½Π΅ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π»ΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ, ΠΏΠ΅ΡΠ΅Π΄Π°Π²Π°Π΅ΠΌΡΠΉ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°, Π±ΡΡΡ "combReducers" (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ: let store = createStore(combineReducers
)) ??
Π― Π±Ρ ΡΠΊΠ°Π·Π°Π» Π½Π΅Ρ. ΠΡΠ»ΠΈ Π·Π°Π΄ΡΠΌΠ°ΡΡΡΡ, Redux ΠΈΠΌΠ΅Π΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½Ρ ΡΡΠ½ΠΊΡΠΈΡ ΡΠ΅Π΄ΡΠΊΡΠΎΡΠ°. Π’ΠΎΡ ΡΠ°ΠΊΡ, ΡΡΠΎ Π² ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ combineReducers
, ΡΠ²Π»ΡΠ΅ΡΡΡ Π΄Π΅ΡΠ°Π»ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ. Π§ΡΠΎ ΠΊΠ°ΡΠ°Π΅ΡΡΡ app.js
, ΠΎΠ½ Π½Π΅ Π·Π½Π°Π΅Ρ ΠΈ Π½Π΅ Π·Π°Π±ΠΎΡΠΈΡΡΡ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ ΠΏΡΠΎΠΈΡΡ
ΠΎΠ΄ΠΈΡ Π²Π½ΡΡΡΠΈ ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠ°ΠΊ ΠΌΡ Π΅Π΅ ΡΠΎΠ·Π΄Π°Π»ΠΈ ΠΈΠ»ΠΈ ΡΡΠΎ ΠΎΠ½Π° Π΄Π΅Π»Π°Π΅Ρ.
Π’Π°ΠΊΠΆΠ΅ ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΊΠΎΠ³Π΄Π° reducers/index.js
Π²ΡΠΏΠΎΠ»Π½ΡΠ΅Ρ export default combineReducers({})
, Π½Π° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ ΡΡΠΎ Π½Π΅ _ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅_ ΠΎΠ±ΡΠ΅ΠΊΡΠ° Ρ ΠΈΠΌΠ΅Π½Π΅ΠΌ "combReducers". ΠΠ½ Π³ΠΎΠ²ΠΎΡΠΈΡ: Β«ΠΠΎΠ·ΡΠΌΠΈΡΠ΅ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π²ΡΠ·ΠΎΠ²Π° ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠ°ΠΊΠΈΠΌ Π±Ρ ΠΎΠ½ Π½ΠΈ Π±ΡΠ», ΠΈ ΡΠ΄Π΅Π»Π°ΠΉΡΠ΅ Π΅Π³ΠΎ ΡΠΊΡΠΏΠΎΡΡΠΎΠΌ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡΒ». Π€Π°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ, ΡΠ΅Ρ
Π½ΠΈΡΠ΅ΡΠΊΠΈ ΡΡΠΎΡ Π²ΡΠ²ΠΎΠ΄ Π΄Π°ΠΆΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΡΠ΅Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠΌΠ΅Π½ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΡΠ²ΡΠ·Π°Π½Π½ΠΎΠ³ΠΎ Ρ Π½ΠΈΠΌ.
ΠΠ°ΠΊΠΎΠ½Π΅Ρ, ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΊΠΎΠ³Π΄Π° Π²Ρ Π²ΡΠΏΠΎΠ»Π½ΡΠ΅ΡΠ΅ export default
, Π»ΡΠ±ΠΎΠΉ ΠΈΠΌΠΏΠΎΡΡΠΈΡΡΠ΅ΠΌΡΠΉ ΡΠ°ΠΉΠ», ΡΡΠΎΡ ΡΠΊΡΠΏΠΎΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΌΠΎΠΆΠ΅Ρ Π΄Π°ΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΈΠΌΡ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π·Π°Ρ
ΠΎΡΠ΅Ρ, Π΄Π»Ρ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ Π½Π°Π·ΡΠ²Π°ΡΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ ΡΠ΅ΠΌ-ΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ ΠΎΡ ΡΠΎΠ³ΠΎ ΠΈΠΌΠ΅Π½ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΎΡΡ Π² ΡΠ°ΠΉΡ Π·Π²ΠΎΠ½ΠΊΠ°. ΠΡΠΈΠΌΠ΅ΡΡ:
function someFunction(a, fred, randomVariableName) {}
const firstVariable = 1;
const theMeaningOfLife = 42;
const aTotallyUselessName = "Whatever";
someFunction(firstVariable, theMeaningOfLife, aTotallyUselessName);
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΈΠΌΠ΅Π½Π° ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ , ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡ Π²Π½Π΅ ΡΡΠ½ΠΊΡΠΈΠΈ, Π½Π΅ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ ΠΈΠΌΠ΅Π½Π°ΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² Π²Π½ΡΡΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ.
ΠΠ½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ ΠΏΡΠΈ ΡΠΊΡΠΏΠΎΡΡΠ΅:
// fileA.js
export default const aThing = 42;
// fileB.js
import iCanGiveThisAnyNameIWant from "fileA";
@markerikson Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ Π·Π° ΠΎΡΠ»ΠΈΡΠ½ΡΠ΅ ΠΎΡΠ²Π΅ΡΡ.
ΠΠΎΠ»ΡΡΠΎΠ΅ ΡΠΏΠ°ΡΠΈΠ±ΠΎ @markerikson.
Π― ΠΈΠ·ΡΡΠ°Ρ Redux Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Ρ JQuery Π±Π΅Π· Π·Π½Π°Π½ΠΈΡ React. ΠΠ°Ρ ΠΎΡΠ²Π΅Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΠΌΠ½Π΅ Π»ΡΡΡΠ΅ ΠΏΠΎΠ½ΡΡΡ ΠΏΡΠΈΠΌΠ΅ΡΡ Ρ ΠΊΠΎΠ΄ΠΎΠΌ React.
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
Π― Π±Ρ ΡΠΊΠ°Π·Π°Π» Π½Π΅Ρ. ΠΡΠ»ΠΈ Π·Π°Π΄ΡΠΌΠ°ΡΡΡΡ, Redux ΠΈΠΌΠ΅Π΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½Ρ ΡΡΠ½ΠΊΡΠΈΡ ΡΠ΅Π΄ΡΠΊΡΠΎΡΠ°. Π’ΠΎΡ ΡΠ°ΠΊΡ, ΡΡΠΎ Π² ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ
combineReducers
, ΡΠ²Π»ΡΠ΅ΡΡΡ Π΄Π΅ΡΠ°Π»ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ. Π§ΡΠΎ ΠΊΠ°ΡΠ°Π΅ΡΡΡapp.js
, ΠΎΠ½ Π½Π΅ Π·Π½Π°Π΅Ρ ΠΈ Π½Π΅ Π·Π°Π±ΠΎΡΠΈΡΡΡ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ Π²Π½ΡΡΡΠΈ ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠ°ΠΊ ΠΌΡ Π΅Π΅ ΡΠΎΠ·Π΄Π°Π»ΠΈ ΠΈΠ»ΠΈ ΡΡΠΎ ΠΎΠ½Π° Π΄Π΅Π»Π°Π΅Ρ.Π’Π°ΠΊΠΆΠ΅ ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΊΠΎΠ³Π΄Π°
reducers/index.js
Π²ΡΠΏΠΎΠ»Π½ΡΠ΅Ρexport default combineReducers({})
, Π½Π° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ ΡΡΠΎ Π½Π΅ _ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅_ ΠΎΠ±ΡΠ΅ΠΊΡΠ° Ρ ΠΈΠΌΠ΅Π½Π΅ΠΌ "combReducers". ΠΠ½ Π³ΠΎΠ²ΠΎΡΠΈΡ: Β«ΠΠΎΠ·ΡΠΌΠΈΡΠ΅ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π²ΡΠ·ΠΎΠ²Π° ΡΡΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠ°ΠΊΠΈΠΌ Π±Ρ ΠΎΠ½ Π½ΠΈ Π±ΡΠ», ΠΈ ΡΠ΄Π΅Π»Π°ΠΉΡΠ΅ Π΅Π³ΠΎ ΡΠΊΡΠΏΠΎΡΡΠΎΠΌ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡΒ». Π€Π°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ, ΡΠ΅Ρ Π½ΠΈΡΠ΅ΡΠΊΠΈ ΡΡΠΎΡ Π²ΡΠ²ΠΎΠ΄ Π΄Π°ΠΆΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΡΠ΅Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠΌΠ΅Π½ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΡΠ²ΡΠ·Π°Π½Π½ΠΎΠ³ΠΎ Ρ Π½ΠΈΠΌ.ΠΠ°ΠΊΠΎΠ½Π΅Ρ, ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΊΠΎΠ³Π΄Π° Π²Ρ Π²ΡΠΏΠΎΠ»Π½ΡΠ΅ΡΠ΅
export default
, Π»ΡΠ±ΠΎΠΉ ΠΈΠΌΠΏΠΎΡΡΠΈΡΡΠ΅ΠΌΡΠΉ ΡΠ°ΠΉΠ», ΡΡΠΎΡ ΡΠΊΡΠΏΠΎΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΌΠΎΠΆΠ΅Ρ Π΄Π°ΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΈΠΌΡ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π·Π°Ρ ΠΎΡΠ΅Ρ, Π΄Π»Ρ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ Π½Π°Π·ΡΠ²Π°ΡΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ ΡΠ΅ΠΌ-ΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ ΠΎΡ ΡΠΎΠ³ΠΎ ΠΈΠΌΠ΅Π½ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΎΡΡ Π² ΡΠ°ΠΉΡ Π·Π²ΠΎΠ½ΠΊΠ°. ΠΡΠΈΠΌΠ΅ΡΡ:ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΈΠΌΠ΅Π½Π° ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ , ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡ Π²Π½Π΅ ΡΡΠ½ΠΊΡΠΈΠΈ, Π½Π΅ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ ΠΈΠΌΠ΅Π½Π°ΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² Π²Π½ΡΡΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ.
ΠΠ½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ ΠΏΡΠΈ ΡΠΊΡΠΏΠΎΡΡΠ΅: