javascript – Semantic-ui模态复制

2023年4月23日 244次阅读

我在路线上有一个Semantic-ui模态,最初按预期工作(第一次加载应用程序).我可以多次打开和关闭,没有问题.如果我离开路线并再次返回,然后再次单击模式按钮(触发下面的事件),模式html将被复制.每次我这样做(导航和返回),都会添加另一个模态.

我的模态分为两个模板,正如我所读到的,它应该是它的样子.

HTML：

<template name="contentList">
  {{> addContent}}
  <button class="ui blue button" href="#" id="modal">
    Add Content
  </button>
</template>

<template name="addContent">
  <div id="modal" class="ui small addContent modal">
    {{>addContentForm}}
  </div>
</template>

<template name="addContentForm">
  <!-- Form HTML goes here -->
</template>

JS：

Template.contentList.events({
  'click #modal': function(e, t) {
    event.preventDefault();
    $('.ui.modal')
    .modal({
      onApprove : function() {
        $('.ui.modal').modal('hide');
      }
    })
    .modal('show');
  }
});

我该怎么做才能阻止这种行为？

最佳答案 好吧,我不觉得自己像个傻瓜……

模态div重复的原因是因为{{> addContent}}模式放在div中.将该代码移出div修复了该问题.我错误地简化了我的问题中的代码！

点赞