如何动态地将vue js函数添加到jquery

我使用可重用的引导模式，即用于编辑，删除操作的相同模态。

当单击编辑或更新按钮时，将弹出相同的模态，我需要将相应的函数附加到模态页脚按钮，根据它的操作。

我的页脚按钮就像，

       Close   

单击编辑按钮时，

  $(document).on('click', '.edit-modal', function() { $('#footer_action_button').text(" Update"); $('#footer_action_button').addClass('glyphicon-check'); $('#footer_action_button').removeClass('glyphicon-trash'); $('.actionBtn').addClass('btn-success'); ..... ...... $('#myModal').modal('show'); $('.actionBtn').click(updateOperation); }); 

类似的删除动作也是..

这里$('.actionBtn').click(updateOperation); 会很好地工作。

但这里updateOperation是一个vueJs函数，

  methods: { updateOperation: function () { ..... ..... }, } 

我无法调用此更新操作。

静态添加@click="updateOperation()" ，它可以正常工作。

Answer 1

我不太清楚你的问题，但这是我如何做到的：

我有一个Modal组件：

Modal.vue：

 
 
  ×  
 {{ title }} 
 
 
  
 
 Fermer Confirmer 
  

和：

 export default { props: ['title','save','close','loading'] } 

如您所见，我在Modal组件的参数中采用了save和close方法。

然后，当我从另一个组件调用组件时，我将方法作为参数发送：

Parent.vue：

  My Modal content here  export default { data () { return { this.showModal = false; } }, methods: { saveAddress () { console.log('fired from my parent component'); }, hideModal () { this.showModal = false; }, displayModal () { this.showModal = true; } }, components: { Modal } } 

我希望这有帮助！