如何在 purescript-halogen 中组合有效的事件处理程序和自定义 EventUpdates？

Question

在我的自定义 Halogen/Purescript 项目中，我遵循 AJAX Example 的模式，我将我的行为分为纯粹的 Input 和有效的 Request。

我想更改我的事件处理程序以使用 preventDefault 行为，但不明白这对 UI 函数的类型有什么影响。

我通过以下方式更改事件处理程序，对 AJAX 示例进行了相同的更改：

之前：

H.button [ A.classes [B.btn, B.btnPrimary]
         , A.disabled busy
         , A.onclick (\_ -> pure (handler code))
         ] [ H.text "Compile" ]

之后：

H.a [ A.classes [B.btn, B.btnPrimary]
    , A.href "#compile"
    , A.disabled busy
    , A.onclick (\_ -> E.preventDefault $> pure (handler code))
    ] [ H.text "Compile" ]

（完整差异可用 here）

我遇到了这种类型的错误：

Cannot unify type
    Example.Ajax.Input
    with type
        Halogen.HTML.Events.Monad.Event Halogen.HalogenEffects<(http ::
        Example.Ajax.HTTP | u32519)> Example.Ajax.Input

在这一点上，我有点迷茫是我需要调整 UI 函数的类型签名还是我错误地应用了 preventDefault 修饰符。

Answer 1

$> 的类型如下所示：

($>) :: forall a. EventHandler a -> b -> EventHandler b

pure 的类型如下所示：

pure :: forall a. a -> EventHandler a

所以问题是通过同时使用两者，你正在制作一个看起来像这样的类型：

EventHandler a -> EventHandler b -> EventHandler (EventHandler b)

但你不想要那个，你只想要一个 EventHandler b，其中 b 是 handler code 的 E.Event 类型。

最好的解决办法就是不使用 pure:

E.preventDefault $> handler code

如果有时您确实有两个 EventHandler 值想要像这样一起使用，则要使用的函数是 *> 而不是 $>。

如何在 purescript-halogen 中组合有效的事件处理程序和自定义 EventUpdates？

How do I combine effectful event handlers and custom EventUpdates in purescript-halogen?

purescript

halogen