Redux: ๊ธฐ๋Šฅ ์š”์ฒญ: bindActionCreators๊ฐ€ ๋ฐฐ์—ด์„ ์ˆ˜๋ฝํ•˜๋„๋ก ํ—ˆ์šฉ

์— ๋งŒ๋“  2016๋…„ 06์›” 10์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: reduxjs/redux

ํ˜„์žฌ bindActionCreators ๋Š” ๋‹จ์ผ ํ•จ์ˆ˜ ๋˜๋Š” ํ•จ์ˆ˜ ๊ฐœ์ฒด๋ฅผ ํ—ˆ์šฉํ•ฉ๋‹ˆ๋‹ค. ์ด ์ฝ”๋“œ ํŒจํ„ด์„ ๋•๊ธฐ ์œ„ํ•ด ๋ฐฐ์—ด๋„ ํ—ˆ์šฉํ•˜๋ฉด ์œ ์šฉํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค.

import * as ac from './actionCreators';

// later in file...
const [doThis, doSomethingElse, doAnotherThing] = bindActionCreators(
  [ac.doThis, ac.doSomethingElse, ac.doAnotherThing
], dispatch);
// ...

๋ชจ๋“  ์‹ค์ˆ˜๋Š” eslint-plugin-import/namespace ์— ์˜ํ•ด ์˜ค๋ฅ˜๋กœ ์ฆ‰์‹œ ํฌ์ฐฉ๋˜๊ธฐ ๋•Œ๋ฌธ์— ์ž‘์„ฑ์ž ์ด๋ฆ„์„ ๋ช…์‹œ์ ์œผ๋กœ ์ง€์ •ํ•˜๋Š” ๊ฒƒ์„ ์ข‹์•„ํ•ฉ๋‹ˆ๋‹ค.

๋‚˜๋Š” ์ด๊ฒƒ์ด ํ•„์š”ํ•œ ๋ณ€ํ™”๋ผ๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค.

diff --git a/src/bindActionCreators.js b/src/bindActionCreators.js
index e70e270..6050c32 100644
--- a/src/bindActionCreators.js
+++ b/src/bindActionCreators.js
@@ -28,6 +28,10 @@ export default function bindActionCreators(actionCreators, dispatch) {
     return bindActionCreator(actionCreators, dispatch)
   }

+  if (Array.isArray(actionCreators)) {
+    return actionCreators.map(ac => bindActionCreator(ac, dispatch));
+  }
+
   if (typeof actionCreators !== 'object' || actionCreators === null) {
     throw new Error(
       `bindActionCreators expected an object or a function, instead received ${actionCreators === null ? 'null' : typeof actionCreators}. ` +

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

bindActionCreator ๋ฅผ ๋” ๋‹คํ˜•์„ฑ์œผ๋กœ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ๋„ˆ๋ฌด ๋งŽ์€ ์ผ์ด๋ผ๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. ์ด ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๋ž˜ํ•‘ ํ•จ์ˆ˜๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ์–ด๋–ป์Šต๋‹ˆ๊นŒ?

function mapBindActionCreators(actions, dispatch) {
  return actions.map(action => bindActionCreator(action, dispatch)
}

๋ชจ๋“  3 ๋Œ“๊ธ€

bindActionCreator ๋ฅผ ๋” ๋‹คํ˜•์„ฑ์œผ๋กœ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ๋„ˆ๋ฌด ๋งŽ์€ ์ผ์ด๋ผ๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. ์ด ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๋ž˜ํ•‘ ํ•จ์ˆ˜๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ์–ด๋–ป์Šต๋‹ˆ๊นŒ?

function mapBindActionCreators(actions, dispatch) {
  return actions.map(action => bindActionCreator(action, dispatch)
}

๋ฐฐ์—ด์ด ์žˆ๋Š” ๊ฒฝ์šฐ reduce() ๋ฐฐ์—ด์„ ๊ฐœ์ฒด์— ๋„ฃ๊ณ  bindActionCreator ์— ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์˜ˆ, ์—ฌ๊ธฐ์—์„œ ๊ฐ€๋Šฅํ•œ ๋ชจ๋“  ์ˆœ์—ด์„ ์ง€์›ํ•˜์ง€ ์•Š๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰