reactjs - 将 React 组件转换为 Stenciljs

Question

为了应对挑战并帮助我学习 Stenciljs，我想将团队所做的一些 React 组件转换为 Stencil 组件。

我不知道 React 和一点点 Stenciljs，但我知道 Angular。我知道 Stenciljs 是来自不同“框架”的好东西的混合体，所以我大概能理解一点。:-)

关于组件移植的任何建议？

可行吗？

有没有人做过这种事？如果是这样，任何可能有用的示例或步骤都会很好。

谢谢

Answer 1

我们将在接下来的几周内做同样的事情，看起来很容易。

我们已经将 react 与 Typescript 一起使用，因此我们已经有了 props 和 state 的接口，只需使用装饰器@Prop()和@State(). 因为在 stencil 中你也有一个render()函数，类似于 react 类组件，你可以复制你的 reactrender()函数的代码（或者如果你有一个基本上只包含一个render()函数的函数式 react 组件，只需复制所有内容）。

需要注意的一件事是，在反应中比在模板中{children}强大得多。<slot />因此，如果您拥有具有很多父/子关系的更大组件，那么翻译将不会那么容易，因为您无法完成slot.map(item => <SomethingElse prop="stuff" />)我所看到的那样的事情。