Question

我一直在尝试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的示例视图，这不起作用，我得到一个空的“示例”节点（请注意情况）：

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：/

Answer 1

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

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

仅HTML基本元素应定义为字符串。

Hyperapp H函数无法构成组件

1 个答案: