VueJS onclick附加元素

任何人都可以建議如何使附加的動態元素點擊VueJS？VueJS onclick附加元素

工具提示按鈕不會觸發vuejs popAlert方法。

const myVue = new Vue({ 
    el: '#vue', 
    methods: { 
     popAlert: function() { 

      alert('clicked'); 

     } 
    } 
}); 

$(function() { 

    $('#calendar').fullCalendar({ 
      defaultDate: '2017-10-12', 
      editable: true, 
      eventLimit: true, // allow "more" link when too many events 
      events: [ 
       { 
        title: 'All Day Event', 
        start: '2017-10-01' 
       }, 
       { 
        title: 'Long Event', 
        start: '2017-10-07', 
        end: '2017-10-10' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2017-10-09T16:00:00' 
       }, 
      ], 
      eventRender: function(event, element, view) { 

       let htmlText = `<div class="ui tooltip"> 
          <h3>Tooltip title</h3> 
          <button type="button" class="ui mini button" @click="popAlert">Delete</button> 
        </div>`; 

       $(element).popup({ 
          inline: false, 
          on: 'click', 
          exclusive: true, 
          hoverable: true, 
          html: htmlText, 
          context: '#vue', 
        }); 
      } 
     }); 

});

https://codepen.io/tonoslfc/full/bomqWR/

來源

2017-10-15 tonoslfx

你混合jQuery和VUE，Vue公司一點兒也不編譯的jQuery添加模板。嘗試使用此Vue插件，而不是：https：//github.com/Wanderxx/vue-fullcalendar – Tomer

@fatman日曆工作正常，其''popup'語義-UI工具提示「刪除」按鈕正在調用'popAlert'方法 – tonoslfx

當然，因爲你通過jquery添加模板，所以Vue不編譯它，而是使用Vue插件。一般來說，儘量避免混合使用jquery和vue，通常你會發現一個與特定插件相匹配的Vue插件 – Tomer