Vuejs - 什么时候应该初始化jquery插件

Question

我有一些需要初始化的JQuery插件,通常这可以使用,$(document).ready(function () { })但在vue组件created事件中执行时似乎不起作用.考虑到这一点,我已经使用了,this.$nextTick(function () { })但这似乎不适用于在子组件上引入的元素.例如,我这样做:

created: function () {
  this.$nextTick(function () {
    window.materialadmin.AppOffcanvas.initialize()
  })
}

我有一个在子组件中引入的按钮,但上面的代码附加的onclick处理程序不会触发.如果我做:

setTimeout(function () {
    window.materialadmin.AppOffcanvas.initialize()
}, 1000)

然后我的点击处理程序将被绑定并工作.

在什么时候绑定我的事件的正确点,以便我不需要依赖setTimeout哪个是hacky？

Answer 1

Mounted或Updated Lifecycle-Hooks应该可以解决您的问题，因为 Mounted 是在实例刚刚挂载后调用的，其中 el 被新创建的 vm.$el 替换，并且 Updated 是在数据更改导致虚拟 DOM 重新渲染后调用的并修补。