javascript - 如何从外部模块生成 Pux 操作？

Question

我正在尝试使用 purescript-pux 和 CodeMirror 编写应用程序，静态代码编辑器。

CodeMirror 从 text-area 中创建一个编辑器，但是事件的处理方式不同，因此我不能使用 Pux.Html.Events 中的 onChange 函数。

要在 CodeMirror 编辑器中处理输入变化，应该这样做:

CodemirrorInstance.on('change',function(cMirror){
  // get value right from instance
  var newValue = cMirror.getValue();
});

我能够制作一个 Codemirror 实例，这是一些微不足道的工作。我遇到的问题是如何让 pux 知道事件。

我订阅了一个 Channel 并用于处理 websocket 消息，但我真的不知道如何从外部 JavaScript 文件向那里发送内容。

Answer 1

你可能只需要在你的外部模块上设置一个信号(purescript-signal)。

也许是这样的:

function CMChangeSignal(constant) {
    /** take initial value here if it  possible and pass it to constan fnt */
    var out = constant();
    // listen to it
    CodemirrorInstance.on('change',function(cMirror){
        // get value right from instance
        var newValue = cMirror.getValue();
        out.set(newValue);
    });
    return function () {
        return out;
    }
}

然后在你的纯脚本文件上:

// type it, read the CodeMirror Docs.
type CMChange = 
    { from :: CMCoordinate
      to :: CMCoordinate
      text :: Array String
      removed :: String
      origin :: ??
    }

foreign import _CMChangeSignal :: forall eff change. (change -> Signal change) -> Eff (dom :: DOM | eff) (Signal CMChange)

cmChanged :: forall eff. Eff (dom :: DOM | eff) (Signal CMChange)
cmChanged = _CMChangeSignal constant

main :: Eff (CoreEffects (dom :: DOM)) Unit
main = do
  urlSignal <- sampleUrl
  let routeSignal = urlSignal ~> (PageView <<< match)
  -- create signal then map it to your Action
  cmSignal <- cmChanged
  let cmChangeSignal = cmSignal ~> CodeMirrorChangedAction

  app <- start
    { initialState: init
    , update: update
    , view: view
    , inputs: [routeSignal, cmChangeSignal]
    }

  renderToDOM "#app" app.html

constant 是 Pux 依赖的“purescript-signal”中定义的函数。