Dom Elm如何制作自定义事件解码器以获取鼠标滚轮移动时的鼠标x/y位置

我试图在Elm 0.19编程语言中的鼠标滚轮移动事件中获取鼠标的x和y坐标。 我试着用这个包裹。请参阅“高级用法”下的：

这个包本身没有描述一个清晰的例子，所以我在一个类似的包中寻找一个例子。 请参阅本页“高级用法”下的示例：

这个例子与我所需要的非常相似，但我也不能让它工作。得到完全相同的问题

下面是我根据示例改编的代码，以适合鼠标滚轮：

module WheelDecoder exposing(..)

import Html exposing (div, text)
import Html.Events.Extra.Wheel as Wheel
import Json.Decode as Decode


type alias WheelEventWithOffsetXY =
  { wheelEvent : Wheel.Event
  , offsetXY : {x: Float, y: Float}
  }

decodeWeelWithOffsetXY : Decode.Decoder WheelEventWithOffsetXY
decodeWeelWithOffsetXY =
  Decode.map2 WheelEventWithOffsetXY
    Wheel.eventDecoder
    offsetXYDecoder

offsetXYDecoder : Decode.Decoder {x: Float, y: Float}
offsetXYDecoder =
  Decode.map2 (\a b -> {x=a,y=b})
    (Decode.field "offsetY" Decode.float)
    (Decode.field "offsetY" Decode.float)

type Msg
  = WheelOffsetXY {x: Float, y: Float}

view = 
  div
    [ (onWheelOffsetXY (\wheelEvent -> WheelOffsetXY (wheelEvent.offsetXY))) ]
    [ (text "mousewheel here") ]


onWheelOffsetXY : (WheelEventWithOffsetXY -> msg) -> Html.Attribute msg
onWheelOffsetXY tag =
  let
    options = { stopPropagation = True, preventDefault = True }
    func = Decode.map tag decodeWeelWithOffsetXY
    attribute = Wheel.onWithOptions options func
  in
    attribute

当我尝试使用“elm make”进行编译时，出现以下错误：

-- TYPE MISMATCH -------------------------------------- src/Map/WheelDecoder.elm

The 2nd argument to `onWithOptions` is not what I expect:

39|     attribute = Wheel.onWithOptions options func
                                                ^^^^
This `func` value is a:

    Decode.Decoder msg

But `onWithOptions` needs the 2nd argument to be:

    Wheel.Event -> msg

Hint: I always figure out the argument types from left to right. If an argument
is acceptable, I assume it is “correct” and move on. So the problem may actually
be in one of the previous arguments!

---

此错误消息很有意义，因为我可以看到存在类型不匹配，但我不知道如何解决它。

似乎

Wheel.eventDecoder

用于

Html.Events.on

或

Html.Events.onWithOptions

而不是

Wheel.onWithOptions

。但是，为了支持

Html.Events.custom

，它们在0.19中被删除，这略有不同。将onWheelOffsetXY替换为

似乎可行：

onWheelOffsetXY:（WheelEventWithOffsetXY->msg）->Html.Attribute msg
onWheelOffsetXY标签=
让
选项消息=
{message=message
，stopPropagation=True
，preventDefault=True
}
译码器=
带偏移量的decodeWeelWithOffsetXY
|>Decode.map标签
|>Decode.map选项
在里面
Html.Events.custom“wheel”解码器

附：顺便说一句，
decodeWeelWithOffsetXY
中有一个输入错误。我把输入错误留在了原处

PPS：另外，您正在查看过时的文档