Purescript:卤素HTML DSL只渲染"id“标签

Question

我使用的是purescript-halogen v0.12.0，但我搞不懂为什么只呈现id标记。

即使是像div这样被认为得到很好支持的元素也会发生这种情况。

示例：

render = div [ id_ "some-id", name "some-name ] []

将创建一个div，但仅具有id属性。对于Halogen.HTML和Halogen.HTML.Indexed中的元素，都会发生这种情况。

任何正确方向的帮助都将不胜感激。

=============================================================

使用以下命令重现该问题。

pulp init
bower i purescript-halogen
npm i virtual-dom

============

module Main where

import Prelude
import Control.Monad.Eff (Eff)
import Control.Monad.Eff.Console (CONSOLE, log)

import Halogen as H
import Halogen.HTML (div, text)
import Halogen.HTML.Properties (id_, name, pixels, height, width)
import Halogen.Util (awaitBody, runHalogenAff)

type State = Int
data Query a = Toggle a

ui :: forall g. (Functor g) => H.Component State Query g
ui = H.component { render, eval }
  where
    render :: State -> H.ComponentHTML Query
    render st = div [ id_ "my-id", name "my-name", height (pixels 3), width (pixels 4) ] [ text "here!" ]

    eval :: Query ~> H.ComponentDSL State Query g
    eval (Toggle next) = pure next

main :: forall e. Eff (H.HalogenEffects e) Unit
main = runHalogenAff $ do
  body <- awaitBody
  H.runUI ui 0 body

Answer 1

这是因为name不是应用于div的valid property，width或height也不是-如果您使用Indexed元素和属性，您将在尝试设置width或height时看到类型错误。尝试更改input的div，您将看到应用的属性是正确的。

但是，索引元素确实允许在div上设置name，这是一个错误。

这些属性没有显示在呈现的HTML中的原因是它们被设置为属性而不是属性。属性必须存在于元素的javascript接口中，否则它们将被忽略。与其说这是卤素的东西，不如说是DOM。