0

我一直在尝试 Hyperapp。

出于多种原因，我想使用h函数而不是 JSX，我不会在这里讨论原因和原因，但请不要使用 JSX！

事情是当我使用 JSX 创建一个组件的实例时，一切都很好。

示例组件（在下面的示例中，此组件和 JSX 等效组件的工作方式相同）：

const Examp = (props) => (
  h("p",{},["this is an example"])
 )

使用 JSX 的示例视图，这会按预期加载 Examp 组件（我看到“这是一个示例”）：

const view = (state, actions) => (
  <main>
    <h1>JSX Example</h1>
    <p>Begin</p>
    <Examp/>
    <p>End</p>
  </main>
)

使用 h 的示例视图，这不起作用，我得到一个空的“examp”节点（注意大小写）：

const view = (state, actions) => (
  h("main",{},[
    h("h1",{},["H Example"]),
    h("p",{},["Begin"]),
    h("Examp",{},[]),
    h("p",{},["End"])
  ])
)

看起来 h 正在更改节点的大小写，这导致它无法加载组件。

我做错了什么，如果是，我应该如何处理？

编辑：查看了 Hyperapp 源代码；hyperapp 使用 document.createElement 来创建节点，并且总是会创建一个小写的节点，因为组件函数需要一个大写字母，组件是否曾经与 h 一起使用过或者这被忽略了？在这种情况下，hyperapp 需要 JSX：/

4

1 回答 1

0

由于 Examp 是一个组件，因此应使用以下语法（不带引号）调用“h”函数：

...
h(Examp, {}, [])
...

只有 HTML 基本元素应该定义为字符串。

于 2019-08-15T07:34:32.220 回答