问题标签 [reactxp]

我们有一个react native使用 的开发项目JavaScript，现在我们决定也拥有它的网站。我们发现它已经Microsoft引入ReactXP并且它也可以发布网站。是否可以将当前的反应原生项目转换为 reactXP？

我正在尝试编写 ReactXP HOC。

这是代码（为了清楚起见，大大简化了）：

现在消费者：

最后一条导出指令未通过以下错误消息进行编译：

有很多可能的解决方案，但似乎没有一个对我有用。

任何帮助表示赞赏。谢谢是提前。

我正在尝试在打字稿中编写 HOC 以在用户必须等待时呈现微调器。

我从这篇文章开始。

这是WithFullScreenSpinnerHOC.ts我的打字稿代码：

将使用此 HOC 的组件必须具有 showSpinner 状态变量。

所以我有一个登录页面，例如用这个 HOC 包装。

但是我在这里遗漏了一些东西，因为更改包装组件中的状态不会触发 HOC 渲染方法。

我在 HOC 的 render 方法中设置了一个断点，以确认它只被调用一次。

任何帮助表示赞赏。

编辑1：这是设计使然，组件不相关，因此我需要一种相互通信的方式。如果可行，我将尝试Resub并回答我自己的问题。

编辑 2：我在下面发布了我的解决方案。我还没有接受它作为正确答案，因为我想提出建议/意见。

我们正在使用Storybook及其StoryShots 插件来可视化和测试我们的 ReactXP 组件。

最近，在这些 StoryShot 上运行测试的 CI 作业开始因快照不匹配而失败。

事实证明，当我们从 Mac 开发环境更新快照时，快照包含一个webkitFlexDirection样式，而 CI 环境生成的快照（基于 docker 映像node:9）没有此属性：

我不知道这webkitFlexDirection是从哪里来的，也不知道为什么它出现在我的 Mac 上生成的快照中，而不是在测试 Docker 映像中生成的快照中。

我webkitFlexDirection在许多顶级存储库（React、ReactXP、Jest、Storybook、StoryShots 等）中搜索过，但一无所获。

我想它react-test-renderer使用一些库来生成快照，并且该库将负责生成（或不生成）webkitFlexDirection属性，但我无法弄清楚。

我在一个必须使用 React Native native modules的 ReactXP 项目中工作。

因此，我将 react-native 类型作为开发依赖项包含在内。

我的项目现在无法编译，出现以下错误：

以下是我的 package.json 文件：

和 tsconfig.json 文件

我不明白我做错了什么。

任何帮助表示赞赏。

例如，是否有一个我可以连接的事件来检测屏幕尺寸的变化，以便我可以让我的元素响应地调整自己的大小？

我已经完成了一半，因为我可以通过UserInterface API检索我的顶级元素的当前大小：

但这只是一次性的电话。我现在想订阅一个处理程序，只要“窗口”调整大小，就会调用该处理程序。例如，桌面用户调整浏览器窗口的大小或移动用户将设备旋转 90°。

ReactXP 有这方面的 API 吗？

我已经开始使用单一代码库为所有三个平台（web、ios 和 android）开发应用程序。

我遇到了这两个库，我想知道哪个更好，为什么？

另外，我遇​​到了很多开源的 react-native 项目，例如React Navigation、 Lottie。

我可以在我的 react-native-web 或 reactXP 应用程序中集成 react-navigation（或任何流行的 react-native 模块）吗？

请提供您的意见和 TIA。

我正在使用 ReactXP（它使用 TypeScript）来编写一个聊天客户端，该客户端显示一个面板，该面板在顶部包含一堆消息，在底部包含一个用于提交新聊天消息的表单。我正在尝试将消息堆栈分解为ChatMessage类型对象的数组。这个特定的例子使用了 VirtualListView 的 ReactXP 扩展。

当我尝试编译下面的示例时，我收到以下错误：

我可以从错误消息中看到ChatMessage[]没有被解释为数组，因为它缺少'length' 属性，这是数组所期望的。

如何ChatMessage[]正确投射，以便ChatMessageStackView调用render()没有错误？为什么messages我引用时会变成嵌套对象this.props.stack？

这是示例：

谢谢你的帮助。

我试图在我的 ReactXP 应用程序中包含一个 VirtualListView。网络版本按预期工作，但在 android 上运行相同的应用程序时未显示列表。

我使用以下基本步骤创建了一个最小示例：

1. create-rx-app使用命令创建应用程序

2. 主要使用此处提供的示例代码创建了一个 VirtualListView 组件：https ://microsoft.github.io/reactxp/docs/extensions/virtuallistview.html

3. 将 VirtualListView 组件添加到我的应用程序视图中
4. npm run start:web使用和启动应用程序npm run start:android

为什么列表没有显示在android上？

这是结果在 android 和 web 上的样子：

应用程序.tsx

FruitListView.tsx