Elm 检查是否按下 ctrl 键 onClick

Question

使用 elm-html，如何检查单击时是否按下了 ctrl 键？

“控制键按下”是我需要在其他地方维护的某种状态，也许是使用键盘模块？如果是这样，那将如何适应 elm-html？

我从著名的榆树示例之一改编了以下代码:

import Keyboard
import Html exposing (..)
import Html.Attributes exposing (style)
import Html.Events exposing (onClick)
import Signal exposing(Signal, Mailbox)


type alias Model =
  { count: Int
  , ctrl : Bool
}

initialModel : Model
initialModel = { count = 0, ctrl = False}

type Action = Increment | Decrement | NoOp

update : Action -> Model -> Model
update action model =
  case action of
    Increment ->
      { model | count = model.count + 1 }
    Decrement ->
      { model | count = model.count - 1 }
    NoOp ->
      model


view : Signal.Address Action -> Model -> Html
view address model =
  div []
    [ button [ onClick address Decrement ] [ text "-" ]
    , div [] [ text (toString model) ]
    , button [ onClick address Increment ] [ text "+" ]
    ]


actions : Mailbox Action
actions =
  Signal.mailbox NoOp

model : Signal Model
model =
  Signal.foldp update initialModel actions.signal -- Keyboard.ctrl ?

main =
  Signal.map (view actions.address) model

如何更新模型的“ctrl”字段的值？

Answer 1

您首先需要一个 Action 能够设置是否按下 CTRL 的值:

type Action = Increment | Decrement | SetCtrl Bool | NoOp

您在更新函数中的 case 语句需要处理该新操作:

SetCtrl bool -> { model | ctrl = bool }

现在您需要一个可以映射 Keyboard.ctrl 的端口一个任务的 bool 值，它发送一个带有新 Action 的信号:

port ctrlToAction : Signal (Task.Task Effects.Never ())
port ctrlToAction =
  Signal.map (Signal.send actions.address << SetCtrl) Keyboard.ctrl