redux#bindActionCreators JavaScript Examples

/**
 * React hook for access to notifications. Returns
 * showSuccess, showError and showMessage
 * @returns {object} Notification actions
 */
export default function useNotifications() {
  const dispatch = useDispatch()
  return useMemo(() => {
    return bindActionCreators(actions, dispatch)
  }, [dispatch])
}

mapDispatchToProps = (dispatch) => {
  return bindActionCreators(
    {
      showTransferModal,
      showDepositModal,
      showWithdrawModal,
    },
    dispatch
  );
}

function mapDispatchToProps(component) {
	switch (component) {
		case "Component_1": return function (dispatch) {
			return {
				change_value_1: bindActionCreators(action_1, dispatch)
			};
		};
		case "Component_2": return function (dispatch) {
			return {
				change_value_2: bindActionCreators(action_2, dispatch)
			};
		};
		default: return undefined;
	}
}

mapDispatchToProps = (dispatch) => bindActionCreators({
  getAll: getRestaurants,
  getPopular: getPopularRestaurants,
  getNew: getNewRestaurants,
  getOpen: getOpenRestaurants,
  select: selectRestaurant,
  changeMode: setMode,
  reset: resetBooking,
}, dispatch)

export default function configureStore (preloadedState) {
  const epicMiddleware = createEpicMiddleware()
  const middlewares = [epicMiddleware]

  // https://github.com/zalmoxisus/redux-devtools-extension#11-basic-store
  const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose

  const composedEnhancers = composeEnhancers(
    applyMiddleware(...middlewares)
    // other store enhancers could be added here
  )

  const store = createStore(reducer, preloadedState, composedEnhancers)

  epicMiddleware.run(rootEpic)

  bindActionCreators(toastrActions, store.dispatch)

  return store
}

export function mapDispatchToProps(dispatch) {
  return bindActionCreators(
    {
      getData,
      getDataSucceeded,
      onChangeBulk,
      onChangeBulkSelectall,
      onChangeListHeaders,
      onDeleteDataError,
      onDeleteDataSucceeded,
      onDeleteSeveralDataSucceeded,
      onResetListHeaders,
      resetProps,
      setModalLoadingState,
      toggleModalDelete,
      toggleModalDeleteAll,
      setLayout,
    },
    dispatch,
  );
}

function mapDispatchToProps(dispatch) {
  return {
    dispatch,
    ...bindActionCreators({
      unmaskAlertRuleAction,
      closeJsonTableViewModal,
      saveClusteringRuleAction,
      maskDocsAction,
      toaster,
    }, dispatch),
  };
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators(
    {
      getForecast: forecastUIActions.getForecast,
      resetForecast: forecastUIActions.resetForecast,
    },
    dispatch
  );
}

export default function defaultConnect({actions, options}) {
    return function connectComponent(component) {
        const {
            mapStateToProps = () => ({}),
            mapDispatchToProps = (dispatch) => {
                const ac = bindActionCreators(actions, dispatch);
                Object.keys(actions).forEach(key => {
                    if (typeof actions[key] === 'object') {
                        ac[key] = bindActionCreators(actions[key], dispatch);
                    }
                });

                return {action: ac};
            },
            mergeProps,
            LayoutComponent,
        } = component;

        // 只要组件导出了mapStateToProps，就说明要与redux进行连接
        // 优先获取LayoutComponent，如果不存在，获取default
        if (mapStateToProps) {
            let com = LayoutComponent || component.default;
            if (!com) return component;
            return connect(
                mapStateToProps,
                mapDispatchToProps,
                mergeProps,
                options
            )(com);
        }
        return LayoutComponent || component.default || component; // 如果 component有多个导出，优先LayoutComponent，其次使用默认导出
    };
}

export function useActions(actions, deps) {
  const dispatch = useDispatch();

  return useMemo(
    () => {
      if (Array.isArray(actions)) {
        return actions.map((action) => bindActionCreators(action, dispatch));
      }

      if (Object.prototype.toString.apply(actions) === '[object Object]') {
        return Object.entries(actions).reduce((bindActions, [actionName, action]) => {
          bindActions[actionName] = bindActionCreators(action, dispatch);

          return bindActions;
        }, {});
      }

      return bindActionCreators(actions, dispatch);
    },
    deps ? [dispatch, ...deps] : [dispatch],
  );
}

mapDispatchToProps = (dispatch) => {
  return bindActionCreators(
    {
      showTransferModal,
      showDepositModal,
      showWithdrawModal,
      showReceiveNewModal,
    },
    dispatch
  );
}

mapDispatchToProps = (dispatch) => ({
  actions: bindActionCreators({
    getDetails,
    getCredits,
    getVideos,
    getImages,
    getGenres,
    getRecomms,
  }, dispatch)
})

mapDispatchToProps = (dispatch) =>
  bindActionCreators(
    {
      deleteQuestion,
      fetchQuestions,
      setThisQuestion: setQuestion,
    },
    dispatch
  )

export function whenMapDispatchToPropsIsObject(mapDispatchToProps) {
  return mapDispatchToProps && typeof mapDispatchToProps === 'object' ? wrapMapToPropsConstant(function (dispatch) {
    return bindActionCreators(mapDispatchToProps, dispatch);
  }) : undefined;
}

function mapDispatchToProps(dispatch) {
    let boundActions = bindActionCreators(actions, dispatch);
    boundActions.dispatch = dispatch;

    return boundActions;
}

mapDispatchToProps = function(dispatch) {
  return {
    actionsUser: bindActionCreators(UserActions, dispatch)
  };
}

mapDispatchToProps = dispatch => bindActionCreators({ ...marketplaceActions }, dispatch)

function mapDispatchToProps(dispatch) {
  return {
    claimProcessingActions: bindActionCreators(claimProcessingActions, dispatch)
  };
}

mapDispatchToProps = (dispatch) => {
  return bindActionCreators({}, dispatch);
}

function mapDispatchToProps(dispatch) {
  return {
    authActions: bindActionCreators(authActions, dispatch),
    promotionActions: bindActionCreators(promotionActions, dispatch),
  };
}

mapDispatchToProps = (dispatch) => bindActionCreators({
  addReservation: createBooking,
  edit: editBooking,
}, dispatch)

mapDispatchProps = (dispatch) => bindActionCreators({ reload }, dispatch)

export default function Account(props) {
  let state = useSelector(state => ({
    newTransactions: state.queries.newTransactions,
    matchedTransactions: state.queries.matchedTransactions,
    accounts: state.queries.accounts,
    failedAccounts: state.account.failedAccounts,
    categoryGroups: state.queries.categories.grouped,
    syncEnabled: state.prefs.local['flags.syncAccount'],
    dateFormat: state.prefs.local.dateFormat || 'MM/dd/yyyy',
    expandSplits: props.match && state.prefs.local['expand-splits'],
    showBalances:
      props.match &&
      state.prefs.local['show-balances-' + props.match.params.id],
    showExtraBalances:
      props.match &&
      state.prefs.local['show-extra-balances-' + props.match.params.id],
    payees: state.queries.payees,
    modalShowing: state.modals.modalStack.length > 0,
    accountsSyncing: state.account.accountsSyncing,
    lastUndoState: state.app.lastUndoState,
    tutorialStage: state.tutorial.stage
  }));

  let dispatch = useDispatch();
  let actionCreators = useMemo(() => bindActionCreators(actions, dispatch), [
    dispatch
  ]);

  let params = useParams();
  let location = useLocation();
  let activeLocation = useActiveLocation();

  let transform = useMemo(() => {
    let filter = queries.getAccountFilter(params.id, '_account');

    // Never show schedules on these pages
    if (
      (location.state && location.state.filter) ||
      params.id === 'uncategorized'
    ) {
      filter = { id: null };
    }

    return q => {
      q = q.filter({ $and: [filter, { '_account.closed': false }] });
      return q.orderBy({ next_date: 'desc' });
    };
  }, [params.id]);

  return (
    <SchedulesProvider transform={transform}>
      <SplitsExpandedProvider
        initialMode={state.expandSplits ? 'collapse' : 'expand'}
      >
        <AccountHack
          {...state}
          {...actionCreators}
          modalShowing={
            state.modalShowing ||
            !!(activeLocation.state && activeLocation.state.locationPtr)
          }
          accountId={params.id}
          location={props.location}
        />
      </SplitsExpandedProvider>
    </SchedulesProvider>
  );
}

mapDispatchToProps = (dispatch) => ({
  actions: bindActionCreators(TodoActions, dispatch),
})