取消Elm中的订阅

我正在关注Elm指南，并且我正试图为时钟示例实现暂停按钮。在指南中写道：取消Elm中的订阅

添加一个按钮来暂停时钟，关闭时间订阅。

我所做的只是给模型添加一个paused属性并在更新函数中使用它。我该如何取消订阅？

module Main exposing (..) 

import Html exposing (Html) 
import Html.App as App 
import Html.Events exposing (onClick) 
import Svg exposing (..) 
import Svg.Attributes exposing (..) 
import Time exposing (Time, second) 


main = 
    App.program 
     { init = init 
     , view = view 
     , update = update 
     , subscriptions = subscriptions 
     } 


type alias Model = 
    { time : Time 
    , paused : Bool 
    } 


init : (Model, Cmd Msg) 
init = 
    (Model 0 False, Cmd.none) 


type Msg 
    = Tick Time 
    | Toggle 


update : Msg -> Model -> (Model, Cmd Msg) 
update msg model = 
    case msg of 
     Tick newTime -> 
      if not model.paused then 
       (Model newTime False, Cmd.none) 
      else 
       (model, Cmd.none) 

     Toggle -> 
      (Model model.time (not model.paused), Cmd.none) 


subscriptions : Model -> Sub Msg 
subscriptions model = 
    Time.every second Tick 


clock : Time -> Html Msg 
clock time = 
    let 
     sAngle = 
      turns (Time.inMinutes time) 

     sHandX = 
      toString (50 + 40 * cos sAngle) 

     sHandY = 
      toString (50 + 40 * sin sAngle) 
    in 
     svg [ viewBox "0 0 100 100", width "300px" ] 
      [ circle [ cx "50", cy "50", r "45", fill "#0B79CE" ] [] 
      , line [ x1 "50", y1 "50", x2 sHandX, y2 sHandY, stroke "#023963" ] [] 
      ] 


view : Model -> Html Msg 
view model = 
    let 
     btnText = 
      if model.paused then 
       "Start" 
      else 
       "Pause" 
    in 
     Html.div [] 
      [ clock model.time 
      , Html.button [ onClick Toggle ] [ Html.text btnText ] 
      ]

来源

2016-08-01 Pep.

而不是取消订阅，为什么不检查模型是否暂停和noop（返回一个空的行动或任何需要）订阅功能内？ – pdoherty926

显然是这样，谢谢 –

我想你可以简单地在您subscription函数返回Sub.none，而不是当它被暂停。

如果您选择这样做，那么您可以在update函数中恢复 Tick处理函数。

subscriptions : Model -> Sub Msg 
subscriptions model = 
    if model.paused 
    then Sub.none 
    else Time.every second Tick

来源

2016-08-01 23:27:57 Tosh

我完全跳过了订阅模型参数！谢谢 –

取消Elm中的订阅

回答

相关问题