haskell - 反射FRP : How to set button text from textInput on button click

Question

我有一个简单的小部件，它应该从给定的文本输入字段设置按钮的“文本”。

虽然我设法做了一个简单清晰的功能

buttonWidget :: MonadWidget t m => m ()
buttonWidget = do
  send  <- button "clear"
  input <- textInput $ def & setValue .~ fmap (const "") send
  return ()

我没有设法设置按钮标签 - 下面的代码可以编译

buttonWidget :: MonadWidget t m => m ()
buttonWidget = do
  rec send  <- button val
      input <- textInput $ def & setValue .~ fmap (const "") send
      val   <- sample $ current $ view textInput_value input
  return ()

但是查看输出index.html - 我只得到一个带有控制台错误消息的白色页面:

rts.js:7313 thread blocked indefinitely in an MVar operation

Answer 1

这里发生的是 button 接受字符串(或文本，取决于版本)，并且该字符串取决于文本输入的值，而文本输入的值又取决于由按钮。现在，通常事件网络中的类似循环就可以了，但在这里您需要对输入值进行采样，以在渲染按钮之前获取文本(因为它需要将该文本渲染到 DOM)。

以下代码(用 hsnippet 编写，因此较旧的 reflex-dom，并经过简化(无镜头)，显示了如何定义一个“按钮”助手，该助手在写入 DOM 之前不需要实现输入文本:

app :: MonadWidget t m => App t m ()
app = do
  rec send  <- button' $ _textInput_value input
      input <- textInput $ def { _textInputConfig_setValue = fmap (const "") send }
  return ()

button' :: MonadWidget t m => Dynamic t String -> m (Event t ())
button' s = do
  (e, _) <- elAttr' "button" (M.singleton "type" "button") $ dynText s
  return $ domEvent Click e