更新函数没有调用按钮点击

点击一个按钮（应发送消息）后，我的更新函数不会被调用。更新函数没有调用按钮点击

下面是应与onClick事件触发的功能代码：

[ input [ type_ "submit", onClick TopicSelected, value (getTopic topic) ] []

这里的更新功能：

update : Msg -> Model -> Model 
update msg model = 
    case msg of 
     TopicSelected -> 
      { model 
       | articles = [] 
       , podcasts = [] 
       , videos = [] 
      } 

view model = 
    div [] 
     [ table [] 
      [ tr [] [ td [] [ b [] [ text "Videos" ] ] ] 
      , div [] <| contentUI model.videos 
      , tr [] [ td [] [ b [] [ text "Podcasts" ] ] ] 
      , div [] <| contentUI model.podcasts 
      , tr [] [ td [] [ b [] [ text "Articles" ] ] ] 
      , div [] <| contentUI model.articles 
      ] 
     ]

这里是全功能的路由，然后onClick事件：

topicTocheckbox : Topic -> Html Msg 
topicTocheckbox topic = 
    div [] 
     [ input [ type_ "submit", onClick TopicSelected, value (getTopic topic) ] [] 
     , label [] [ text <| getTopic topic ] 
     ]

The code can be found on GitHub。

来源

2017-06-06 Scott Nimrod

当我拿出您的'Contributor.elm'文件并存储了几个函数来编译它时，'onClick'函数发送了预期的消息。 [这里是例子]（https://ellie-app.com/3pXwSHbrmmQa1/0）。你有其他的包装代码或可能会干扰的覆盖？ –

我不这么认为......我观察了代码也适用于您的示例。有什么工具可以用来诊断吗？ –

看着你的代码，你试图在Home.elm中使用Contributor.elm的嵌套“组件”，但是你并没有在父（Home）更新函数中进行连接。

这是榆树社区中一个广泛和有争议的话题。典型的建议是尽量避免像这样嵌套，除非绝对必要。

如果你绝对需要窝在这种方式，那么你的代码将与update案件变化撒这样的：

type ParentMsg 
    = ... 
    | ChildMsg Child.Msg 

type alias ParentModel = 
    { ... 
    , child : Child.Model 
    } 

case msg of 
    ChildMsg childMsg -> 
     let (childModel, childCmd) = Child.update childMsg model.child 
     in { model | child = childModel } ! [ Cmd.map ChildMsg childCmd ]

在每一层嵌套，你需要线了孩子状态并来回传递孩子Msg和Cmds。

这就是说，在你的代码中，你正在处理一个贡献者列表，这意味着你还需要传递一个索引，以便知道你正在编辑的列表中的哪个贡献者（here is a minimal example of updating model array elements）。

好消息是榆树使得重构变得轻而易举！

来源

2017-06-06 18:11:41

我感谢您的反馈。看起来我必须从两个极端之一挑选。（1）：为嵌套控件编写额外的管道代码，并保持每个模块文件的合理LOC。或者（2）：有一个臃肿的页面（即Home.elm），它具有用户可以导航到的每个页面的全部视图定义，全部在该单个模块内。 –

更新函数没有调用按钮点击

回答

相关问题