• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript react-redux.connect函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中react-redux.connect函数的典型用法代码示例。如果您正苦于以下问题:TypeScript connect函数的具体用法?TypeScript connect怎么用?TypeScript connect使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了connect函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: factory

function factory(
    showModal: (s: State) => boolean,
    closeActionEmitter: () => Action,
    applyActionEmitter: () => Action
) {

    function mapStateToProps(state: State): PendingChangesModalComponent.Props {
        return {
            show: showModal(state)
        };
    }

    return connect(
        mapStateToProps,
        {
            onHide: () => closeActionEmitter(),
            onContinueAndDiscard: () => batch(
                applyActionEmitter(),
                closeActionEmitter()
            ),
            onContinueAndSave: () => batch(
                saveCurrentCartride(),
                applyActionEmitter(),
                closeActionEmitter()
            )
        }
    )(PendingChangesModalComponent);
}
开发者ID:mschroeder,项目名称:6502.ts,代码行数:28,代码来源:pendingChangesModal.ts


示例2: connect

export default <TInner extends {}, TOutter extends {}>(
  mapEventsToProps: (ownProps: TOutter, eventsData: Linode.Event[]) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
  const eventsData = state.events.events;

  return mapEventsToProps(ownProps, eventsData);
});
开发者ID:displague,项目名称:manager,代码行数:7,代码来源:events.container.ts


示例3: connect

) => <TUIState, TMappedProps = Props<TUIState>>(
  id: string,
  mapProps?: MapCreateUIStateProps<TUIState, TMappedProps>,
) => connect(
  (state: TAppState, props: UIStateComponentProps<TMappedProps>) => ({
    uiState: uiStateSelector(
      state, Object.assign({ uiStateId: id, uiStateBranchSelector }, props)
    ) as TUIState,
  }),
  (dispatch) => ({
    setUIState: setUIStateSelector<TUIState, UIStateIdProps<{}>>(dispatch, { uiStateId: id }),
  }),
  // Using Object.assign here to avoid "Spread types may only be created from object types"
  // https://github.com/Microsoft/TypeScript/issues/10727
  (stateProps, dispatchProps, ownProps) => Object.assign(
    {},
    ownProps,
    mapProps
      ? mapProps({...stateProps, ...dispatchProps})
      : {...stateProps, ...dispatchProps}
  )
)((props) => {
  // Until TypeScript allows spread on interfaces, force props to any to allow ES7 rest syntax
  // https://github.com/Microsoft/TypeScript/issues/16780
  // tslint:disable-next-line:no-any
  const { children, ...rest } = props as any;
  return children(rest);
});
开发者ID:jamiecopeland,项目名称:redux-ui-state,代码行数:28,代码来源:createUIState.ts


示例4: connect

export default <TInner extends {}, TOutter extends {}>(
  mapAccountToProps: (ownProps: TOutter, account?: Linode.Profile) => TInner
) =>
  connect((state: ApplicationState, ownProps: TOutter) => {
    const profile = state.__resources.profile.data;

    return mapAccountToProps(ownProps, profile);
  });
开发者ID:linode,项目名称:manager,代码行数:8,代码来源:profile.container.ts


示例5: connect

export default <TInner extends {}, TOutter extends {}>(
  mapToProps: MapProps<TOutter, TInner>
) =>
  connect((state: ApplicationState, ownProps: TOutter) => {
    const { loading, error, entities } = state.__resources.linodes;

    return mapToProps(ownProps, entities, loading, error);
  });
开发者ID:linode,项目名称:manager,代码行数:8,代码来源:withLinodes.container.ts


示例6: connect

export const withNotifications = (
  mapState: (s: State) => any = defaultMapState,
  mapDispatch: (actions: Actions) => any = defaultMapDispatch
) =>
  connect(
    (state: ApplicationState) => mapState(state.__resources.notifications),
    mapDispatch(actions)
  );
开发者ID:linode,项目名称:manager,代码行数:8,代码来源:notification.containers.ts


示例7: connect

export default <TInner extends {}, TOutter extends {}>(
  mapImagesToProps: (ownProps: TOutter, images: Linode.Image[], imagesLoading: boolean, imageError?: string ) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
  const images = state.__resources.images.entities;
  const imagesLoading = state.__resources.images.loading;
  const { error } = state.__resources.images;
  const imageError = isEmpty(error) ? error![0].reason : undefined; // @todo use updated error handling utils after they're merged

  return mapImagesToProps(ownProps, images, imagesLoading, imageError);
});
开发者ID:displague,项目名称:manager,代码行数:10,代码来源:withImages.container.ts


示例8: dispatch

export default <AppState, Data>({
    namespace,
    contentTypes,
}: {
    namespace: string
    contentTypes: Array<IContentType<Data>>
}) => {
    const actions = actionsFactory<Data>(namespace)

    const mapStateToProps = ({
        panes
    }: AppState & {
        panes: IPanesState<Data>
    }) => {
        const entry = panes[namespace]

        return {
            namespace,
            root: entry === undefined ? undefined : entry.panes.find(pane => pane.childOf === undefined),
            panes: entry === undefined ? [] : entry.panes,
            contentTypes
        }
    }

    const mapDispatchToProps = (dispatch: Dispatch) => ({
        init:  () => {
            dispatch(actions.initPanesNamespace())
        },
        setCurrentPane: (paneId: string) => {
            dispatch(actions.setCurrentPane(paneId))
        },
        addContentToCurrentPane: (content: IPaneContent<Data>) => {
            dispatch(actions.addContentToCurrentPane(content))
        },
        setPaneCurrentContent: (paneId: string, contentId: string) => {
            dispatch(actions.setPaneCurrentContent(paneId, contentId))
        },
        removePaneContent: (paneId: string, contentId: string) => {
            dispatch(actions.removePaneContent(paneId, contentId))
        },
        removeContentFromAllPanes: (contentId: string) => {
            dispatch(actions.removeContentFromAllPanes(contentId))
        },
        splitPane: (paneId: string, axis: PaneSplitAxis) => {
            dispatch(actions.splitPane(paneId, axis))
        },
    })

    class NameSpacedPaneManager extends PaneManager<Data> {}

    return connect(
        mapStateToProps,
        mapDispatchToProps
    )(NameSpacedPaneManager)
}
开发者ID:manishshanker,项目名称:wiremock-ui,代码行数:55,代码来源:createPaneManager.ts


示例9: connect

export default <TInner extends {}, TOutter extends {}>(
  mapVolumesToProps: (ownProps: TOutter, volumesData: VolumesData, volumesLoading: boolean, volumesError?: Error ) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
  const { items, itemsById } = state.__resources.volumes;

  const volumesData = { items, itemsById };
  const volumesLoading = state.__resources.volumes.loading;
  const volumesError = state.__resources.volumes.error;

  return mapVolumesToProps(ownProps, volumesData, volumesLoading, volumesError);
});
开发者ID:displague,项目名称:manager,代码行数:11,代码来源:volumes.container.ts


示例10: mapSelectors

}: Config = {}) => (
    mapStateToProps,
    mapActionsToProps?: any
  ) => {
  const makeMapStateToProps = () => mapSelectors(selectors, mapStateToProps)

  let connectState = connect(makeMapStateToProps)

  if (mapActionsToProps) {
    const mapDispatchToProps = (dispatch: Dispatch<State>, ownProps: OP) => (
      mapActions(actions, mapActionsToProps, { dispatch, ownProps })
    )

    connectState = connect(makeMapStateToProps, mapDispatchToProps)
  }

  return compose(
   connectState,
   stateHOC
  )
}
开发者ID:spartansystems,项目名称:booster-kit-react,代码行数:21,代码来源:connectState.ts



注:本文中的react-redux.connect函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript react-redux.Dispatch类代码示例发布时间:2022-05-25
下一篇:
TypeScript react-promise-tracker.trackPromise函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap