问题标签 [recompose]

我有这个URL: /user/Jd5Egbh... 我使用 react-router-dom 进行导航。我制作了一个 UserDetails 组件。我mapStateToProps用来获取这样的 url 参数：

它工作正常，但我想保护这条路线并只允许经过身份验证的用户访问。

在其他组件中，我使用一个withAuthorization组件并从重组中组合来保护路由。

我尝试将这两个功能结合起来，如下所示：

但在功能ownProps_undefinedmapStateToProps

如果我使用 compose 来保护路由，如何访问 URL 参数？

编辑1：

基本上，我想要这样的东西：

我几乎可以肯定这是不可能的，但我还没有找到确切的确认。

该用例正在改进recompose 的 withStateHandlers 的类型，从而可以像这样定义状态更新器：

我有一个更高阶的组件，当我的数据仍在加载（数据来自查询）时，它使用renderComponentwith来显示加载屏幕：branchreact-apollo

这很好用，但是当我尝试用玩笑和酶进行测试时，它给我带来了麻烦。我的测试包括该行

Backups包裹在哪里waitForLoad()。

测试给出以下错误

删除时一切正常renderComponent。

我有一个安装文件在其他所有东西之前运行：

针对上述错误，我尝试了很多解决方案，包括：

• https://github.com/airbnb/enzyme/issues/395
• https://github.com/airbnb/enzyme/issues/58
• React + Enzyme 错误：Invariant Violation：dangerousRenderMarkup(...)：无法在工作线程中渲染标记

有任何想法吗？

我有这个简单的组件

这是我的第二个组件，参考第一个组件

在这种情况下，在 console.log 中，我将收到所有 App 组件的功能（a、b、c），但如果我Recompose.withState在App组件上使用，我将不再收到它们。请参阅此处的示例 https://codepen.io/anon/pen/qYjpoE?editors=1111

看工作方式开关

至

我在这里想念什么？为什么使用 Recompose HOC 会删除App类组件内部功能？

谢谢。

我用 recompose 做了一个简单的 HOC，但由于某种原因它不能使用默认道具。如果我从外部提供的道具正常工作，但不是默认道具（我得到'onCallback'不是一个函数，所以基本上是一个未定义的错误）

我的 HOC：

我尝试将它与默认道具一起使用但它不起作用的地方：

我在哪里提供它的道具，所以它可以正常工作：

我正在尝试用withStateHandlersfrom recompose 包装一个无状态功能组件。我发现我能做到这一点的唯一方法是，如果我调整我的证监会的道具以匹配withStateHandlers“泄漏”的某些方面。我做错了什么还是这是recompose类型的缺陷？

我的证监会：

从这里，我想用withStateHandlers：

但这不起作用，我在编译时收到此错误：

这是由于在 MyComponent 的 propstoggleEditing中定义的。() => void我解决了这个问题，并且还收到有关缺少索引器的错误。

为了让编译器满意，我需要将MyComponent的 IProps 更改为：

我必须更改toggleEditing以匹配StateHandler<T>@types/recompose 中定义的 a 类型。我还需要添加索引器。这看起来是因为在 @types/recompose 中，withStateHandlers返回一个InferableComponentEnhancerWithProps<TOutter & TState &TUpdates, TOutter>，最终在您遍历所有类型之后，仍然期望组件上有一个索引器。

我在测试中注意到，他们正在定义 SFC，然后将其全部包装在一个地方。因此，证监会实际上有奇怪的道具要求这一事实并不明显。我想自己定义我的 SFC，所以我可以在其他情况下重用它。我只是超出了预期的用例吗？难道我做错了什么？

我刚刚使用 recompose 制作了一个 HOC，但由于某种原因，所有传递的道具都触发了 React 警告。

我所有的属性都具有相同的语法（从小写开始，然后是大写：lowerUpper）。当然，如果我把它写成全小写，那么它不会触发任何警告，但是如果我使用带有 recompose 的 HOC，我应该把我所有的道具都写成小写吗？

我的 HOC：

基本上我的所有财产都在触发这个警告（函数，或者只是一个简单的原语，基本上任何东西[isEditing，inputValue，onChange，deactivateCell，onSaveChanges，handleSave ...等]

我想如何解决这个错误？它真的很烦人。

我正在尝试在打字稿上编写组件，它将用 rxjs 实现 onChange 替换来自 props 的 onChange，就像这样

当我尝试使用 pluck 功能时出现错误：

Subscribable<'Props'> 类型上不存在属性“pluck”

导入包含

我正在为 Google 地图 api 使用 react-google-maps 库。根据文档，这是我使用地图的方式：

这里的问题是，当我使用这个组件时，我需要传递道具“数据”，如果 console.log(props) 我可以看到我的数据道具是正常传递的，但是由于我使用的是打字稿，打字稿现在不涉及这个道具，它给了我这样的错误：

基本上我为此创建接口并声明我的数据道具，并创建这样的反应组件：

然后我可以访问必要的道具。这里的问题，如果我尝试通过接口 IProps，我得到这个：

我相信这是因为 compose 方法。

我认为，这里的问题更多是关于 react-google-maps 库及其与 Typescript 的使用，因为我相信它应该在任何其他情况下都可以使用。但可能不是，也许以其他方式声明我的组件有一个技巧。

我在 React 中使用 recompose，特别是它的compose函数，它的签名为

我在其中传递了一些 React 高阶组件。我将我的TInner和TOuter类型定义为接口，这些接口描述了我的 HoC 运行所需的内容：

（作为演示的愚蠢示例）。但问题是，我的组件有更多的 props，compose 生成的 HoC 需要获取这些额外的 props 并传递它们，例如：

因此，我不能这样做const MyEnhancedComponent = myEnhancer(MyComponent)，因为编译器会抱怨MyEnhancedComponent没有somethingElse作为道具。

我找到了两个解决方法，我都不满意。很好奇更有经验的 TypeScript 开发人员会做什么。

解决方法#1：引入一个函数

通过引入一个函数，我可以使用泛型并向编译器表达我在做什么

我真的不喜欢这个，引入一个将创建增强器的多个副本的函数，只是为了获得泛型？对我来说似乎是错误的。

解决方法 #2：使用 [key:string]: any

我可以改为将我的界面更改为

我基本上[key:string]: any用作穷人的extends IOutterProps。比如，我需要你给我这些道具，如果你给我额外的东西，那么我真的不在乎那些。

这使我可以myEnhancer在我拥有满足要求的组件的任何地方使用，避免添加的功能，并且感觉比解决方法 #1 更好。但是不得不添加也感觉不对[key: string]: any。