向react中的组件添加2个HOC

文章/答案/技术大牛

发布

2回答

如何使用React Redux >= v6.0访问ref？

reactjs、react-redux

在React中，Redux >= v6.0 connnect()选项支持一个新的参数forwardRef: boolean。如果传递了 {forwardRef : true}来连接，则向连接的包装器组件添加ref实际上将返回包装组件的实例。 [...]WrappedComponent) => connect(m

浏览 1提问于2020-01-11得票数 0

1回答

高阶组件不需要dilver InputList

reactjs、react-hooks、higher-order-components

export const HOC = (WrappedComponent) => { > </button> </form>}; export default HOCprops.index)} type="button" &g

浏览 4提问于2021-11-10得票数 1

回答已采纳

1回答

构建Apollo应用程序

apollo、react-apollo

我一直在Typescript中试验GraphQL/Apollo，遇到了大量非常明显的键入问题，这让我怀疑我是不是做错了。实际上，我想要做的(因为它对我有意义)是通过在多个临时调用中粘贴来为我的组件组合数据。下面是我的意思的一个例子(sans Import) theme: Theme; export default

浏览 0提问于2018-04-06得票数 1

1回答

我可以使用useState内部临时(高阶组件)吗？

reactjs、react-hooks、use-state、high-order-component

我有一个临时组件(高阶组件)，它返回一个功能组件。我想使用useState，但是我得到了以下错误消息： “src/HOC.js第5:35行: React "useState”不能在回调中调用。必须在React函数组件或自定义React函数React /rules of Hooks中调用react。import React, { use

浏览 4提问于2021-06-07得票数 2

回答已采纳

1回答

为什么在导出组件而不是导入组件时应用HOC

javascript、node.js、reactjs、redux、commonjs

我的基本理解是，像connect (用于连接redux store)之类的HOC和其他HOC在导出组件时会应用到该组件。HOC，因为这会使组件更容易重用。相同的组件可以从存储或从道具中提取道具，这将是父组件的责任，以检查在组件上应用哪个HOC的内容。我知道我们可以使用容器组件，它接受组件并渲染

浏览 1提问于2017-07-25得票数 1

1回答

reactjs

我在一个react js应用程序中有一个类组件，我想让它使用路由器和转换。interface CommonHeaderProps extends RouteComponentProps<any> { mapStateToProps,)(CommonHeader)); 我希望这个组件是withRout

浏览 9提问于2019-10-29得票数 0

1回答

Flow类型高阶组件(HOC)属性类型保留

javascript、reactjs、flowtype

在这件事上，我的头撞到了墙上。我正在尝试将flowtype整合到一些react项目中。在大多数情况下，键入似乎工作得很好。但是，我使用的是一个库(react-jss)，该库使用HOC将样式表类注入到组件中。问题是这个模块没有流类型，所以它取消了我的组件上的任何属性验证，因为我的所有组件都包装在这个HOC中。我已经能够根据我看到的

浏览 16提问于2017-03-11得票数 3

1回答

如何获取高阶分量的ref值？

reactjs、react-hooks

我有一个要传递ref值的组件。我需要在高阶组件中获取传递的ref值。下面是代码示例: Component with HOC：import HOC from './hoc'; const ref = React.createRe

浏览 24提问于2020-02-19得票数 1

2回答

在JSX中不更改组件名的情况下呈现临时(组件)

reactjs

我有两个HOCs，它们向这样的组件添加上下文： render(，用这个特殊的方法包装组件，这样它就不会对我的JSX结构产生太大影响。如果从呈现中返回组件而不是< Component />，则可能会发生这种情况。在呈现之前创建一个变量来存储临时组

浏览 0提问于2018-09-05得票数 3

回答已采纳

1回答

TypeScript不知道组件从HOC获得所需属性

javascript、reactjs、typescript、high-order-component

我正在用HOC包装我的组件的导出，这会给它添加属性，但是TypeScript没有看到这个属性(这是必需的)已经被HOC添加了。组件：import { withText } from "../hoc"; text: string

浏览 30提问于2019-07-18得票数 1

回答已采纳

1回答

有没有可能从特定的逻辑中有条件地呈现孙子对象？

javascript、reactjs

我正在尝试创建一个HOC，它可以有条件地渲染孙子对象，甚至可能在React中进一步嵌套子对象。<HOC> <Grandchild1/> </Child>例如，在本例中，HOC内部的一些逻辑决定不应该呈现Grandchild1要得到这个结果很容易： <HOC</e

浏览 0提问于2019-05-15得票数 0

1回答

react重用功能/组件功能

reactjs、higher-order-components

我是新来的React JS。将相同的功能/特性应用于大多数页面的最佳实践是什么？案例:我有员工，部门，沙拉利菜单(组件)，我希望所有这些页面都有功能和反应路由器提示功能，以防止用户离开页面时，有更新(脏)的形式。现在，我粘贴每个组件的代码，并在将新组件添加到我的应用程序时粘贴。我已经尝试了高阶组件，是否可以从HOC函数调用另一个HOC函数？inject

浏览 3提问于2018-01-04得票数 0

1回答

React -何时使用钩子，以及何时使用HOCs

javascript、reactjs、react-native

我们什么时候应该使用钩子而不是HOC，什么时候应该使用HOC而不是React中的挂钩？例如，我可以完美地使用一个钩子来管理身份验证状态，然后在组件中使用它……但我也可以有一个HOC，它管理身份验证状态并包装组件以使用它的逻辑。所以..。有没有什么规则可以让你知道你的兴趣是实现一个点还是钩子？

浏览 1提问于2021-04-04得票数 1

1回答

关于反应中的生命周期钩

reactjs、react-hooks

我有一个高阶组件如下。我很难理解什么是第一位的。见下文：import React, {useEffect} from 'react'; }控制台输出如下GLOBAL COMPONENTDIDMOUNT我在这里的问题是:由于包装<

浏览 0提问于2019-07-25得票数 0

回答已采纳

3回答

组件定义缺少临时显示名称。

javascript、reactjs

我正在尝试创建一个更高阶的组件，但是不断地获得这个eslint。 WC.displayName = 'test' <WC />} export defa

浏览 1提问于2019-02-09得票数 14

回答已采纳

1回答

如何在v16 ES6/ES7反应中使用混合蛋白

reactjs、reactfire

基于 for ReactFire，使用它的方法是向组件中添加一个mixin。 Mixins不适合使用，应该使用HoC或Decorator。因此，我想创建一个解码器，虽然我发现使用mixins的唯一方法是通过React.creatClass()，这是不推荐的，甚至在最新的React版本中都无法使用。或者有其他的方法来使用图书馆？

浏览 1提问于2017-10-21得票数 0

回答已采纳

2回答

在es6样式中使用react组件的混合

reactjs、formsy-react

我使用了一个组件:- ，用于创建表单。我正在尝试创建我自己的输入组件之一。如前所述，我需要使用formy的混入。但不幸的是，在es6风格中没有对它的支持。所以任何人都知道周围的工作。这是我的组件代码： class DropDownAutoComplete extends React.Comp

浏览 1提问于2016-06-06得票数 2

1回答

如何在react* HOC中描述流程移除道具*

flowtype

我已经看过几篇关于如何在hoc中使用flow的文章，但如果我不想通过所有的道具，我不知道该怎么做。/* @flow */ pass: string,}

浏览 13提问于2019-01-17得票数 1

回答已采纳

1回答

是否可以将类似连接的组件包装在同一个HoC中，而不是让它们都以相同的方式连接到auth还原器？

reactjs、redux、react-redux

我的一些组件只连接到auth还原程序，唯一的原因是他们需要知道用户是否经过身份验证/日志记录。我创建了一个高级组件(withAuth)来包装这些组件(并添加isLogged支柱)，但我不知道它是否是一个好模式。谢谢你的帮助！编辑-下面是一些需要说明的代码:让我们假设我们有一些小部件共享这些代码(添加一些映射的<

浏览 2提问于2016-08-03得票数 0

回答已采纳

5回答

为什么要使用高阶组件

reactjs、debugging、react-native、google-chrome-devtools

我使用高阶组件呈现加载器。为此，我获得了性能摘要，如下图所示-当我使用简单的if else条件呈现加载器时，我得到了如下的性能图：通过比较，我知道当使用高阶组件时，它比简单循环需要更多的时间。使用高阶组件的优点和缺点是什么？

浏览 1提问于2018-07-24得票数 0

点击加载更多

如何使用React Redux >= v6.0访问ref？

高阶组件不需要dilver InputList

构建Apollo应用程序

我可以使用useState内部临时(高阶组件)吗？

为什么在导出组件而不是导入组件时应用HOC