如何导出控制台日志win Elm？

很难使用Elm导出console.log

我想通过按下下面的按钮和控制台登录功能输出控制台日志。我该怎么办

sampleView : Html Message
sampleView =
    Html.div (class "sample-card" :: Styles.sampleCard)
        [ Html.div
            (class "sample-card-list" :: Styles.sampleCardList)
            [
                Html.button
                    (class "sample-card-button" :: Styles.sampleCardListButton)
                    [
                        Html.text "サンプルボタン"
                    ]
            ]
        ]

如果我使用Javascript，我想像下面这样做

<button class="sample-card-button" onclick="btnClick();">サンプルボタン</button>

/* JavaScript 側 */
function btnClick() {
  console.log("クリックされました");
});

サンプルボタン
/*JavaScript側 */
函数btnClick（）{
控制台日志（“クリックされました");
});

如果只是为了调试，您可以使用，但不能在生产代码中使用

Debug

模块（如果使用

Debug

用法，则使用

--optimize

运行编译器将无法编译）

sampleView : Html Message
sampleView =
    Html.div (class "sample-card" :: Styles.sampleCard)
        [ Html.div
            (class "sample-card-list" :: Styles.sampleCardList)
            [
                Html.button
                    ([class "sample-card-button", onClick CardButtonClicked] ++ Styles.sampleCardListButton)
                    [
                        Html.text "サンプルボタン"
                    ]
            ]
        ]

update : Message -> Model -> ( Model, Cmd Message )
update msg model =
    case msg of
        CardButtonClicked ->
            let
                _ = Debug.log "クリックされました" msg
            in
            ( model, Cmd.none )

如果您想在生产应用程序中写入控制台，您需要。要创建端口，您需要更新它所在的模块，以声明

端口模块

（只需将

端口

添加到文件第一行模块声明的开头）

然后，您需要连接一些JavaScript来处理该端口消息：

var-app=Elm.Main.init（{node:document.querySelector（'Main'）}）
app.ports.consoleLog.subscribe（函数（msg））{
控制台日志（msg）；
});

---

调用

console.log

日志记录对于纯语言（如Elm）来说本质上是很棘手的。如果您希望出于调试目的进行日志记录，请查看该包，特别是

log

函数。

port module Main exposing (..)

port consoleLog : String -> Cmd msg

update : Message -> Model -> ( Model, Cmd Message )
update msg model =
    case msg of
        CardButtonClicked ->
            ( model, consoleLog "クリックされました" )