在Elm中的HTML textarea,其中按Tab键添加\ t并且不会更改焦点

时间:2017-06-06 07:17:59

标签: elm

我知道如何在Elm中按Tab键按键。而且我知道如何使用onWithOptions停止改变焦点:

textarea
    [ onWithOptions "keydown" (Options False True) <| Decode.map KeyDown keyCode ] []

然后我可以在我的update函数中检查按下的keyCode是否为9,代表一个标签。问题是现在textarea的默认行为不起作用。我输入的任何内容都不会显示在textarea中。很简单,我只需将我输入的内容添加到model并将textarea的值设为模型。现在我有光标问题,更重要的是,剪贴板粘贴不起作用......

如何让标签与Elm中的textarea一起正常使用?通常情况下,如果按下Tab键,只调用preventDefault()似乎是有意义的。我如何有条件地在榆树中呼叫preventDefault()

1 个答案:

答案 0 :(得分:1)

Elm支持通过var stringURL: String = "ms-outlook://compose?subject=" + subjectText + "&body=TestingEmailNow" 成功或失败的条件事件传播。只需var subjectText: String = "Test Subject" var encodedSubject = subjectText.addingPercentEncoding(withAllowedCharacters: .urlHostAllowed) if let encodedSubject = encodedSubject { var stringURL: String = "ms-outlook://compose?subject=" + encodedSubject + "&body=TestingEmailNow" // Convert the string to a URL. var url = URL(string: stringURL) if let url = url { // Open the app that responds to the URL scheme (should be Outlook). UIApplication.shared.openURL(url) } } 您要在Decoder函数中作出反应的消息类型:

map

然后使用它作为输入元素的属性:

update

这并非适用于所有情况。如果您希望某些succeededIfTabKey : Int -> Decode.Decoder Int succeededIfTabKey key = if key == 9 then Decode.succeed key else Decode.fail "non-tab" tabPressed : Decode.Decoder Msg tabPressed = Decode.andThen succeededIfTabKey keyCode |> Decode.map (always TabPressed) 个活动不是onWithOptions "keydown" { defaultOptions | preventDefault = True } tabPressed ,而其他keydown活动发送到preventDefault(),那么您运气不佳。