reactjs - 有没有办法在 Elm 中使用 React 组件？

Question

我知道在 React 中使用 Elm 组件(“模块”？仍在学习用语)是 libraries like react-elm-components 的既定模式。 ，但是有没有办法做到相反呢？

例如，这样的事情是可能的:

Top-level React App
 -> React layout/component
    -> Elm components

但是这个怎么样:

Top-level Elm App
  -> Elm layout/components
     -> React components

如果可能的话，“榆树在底部”模式是否更优越？试图解释为什么似乎没有关于它的文献&这是一个可能的解释。

Answer 1

不要那样做。 Elm 的重点是六边形设计。 Elm 旨在作为一个封闭的系统运行，JS 的邪恶无法渗透其中。这就是为什么在 JS 中嵌入 Elm 是一流的，而你却很难找到逆函数。将 React 嵌入 Elm 的想法是移交 Elm 的确定性和保证的值(value)。您还不如根本不使用 Elm。

如果您真的只想在浏览器中进行函数式编程并使用带有 Elm 架构的 React 组件，请查看 PureScript PUX。 PUX 是针对该用例而设计的，它会给您带来比黑客 Elm 更好的结果，以执行 Elm 专门设计来阻止的事情。

如果我的评论对你来说是不可能的，我可以提供以下建议，以这种方式邪恶，但又不会太邪恶。

首先，您可以使用ports 来完成此操作。当您想要渲染 React 组件时，编写 Elm 应用程序以在 JavaScript 端口上触发事件。然后使用 JavaScript 以标准方式在 Elm Dom 空间内渲染 React 组件。

第二(这是您将得到的最接近正确执行的方法)，您可以使用 Elm Native 模块来编写它。这将要求您学习 Elm 未记录的运行时，并编写与其交互的代码。您要做的就是在 Elm 的低级系统中编写一个自定义 Html 元素，在其内部渲染 React 并管理重新渲染。

祝你好运!