我将VUE不是作为水疗中心,而是在页面上用作小部件。有一个弹出式插件(在VUE之外使用的jQuery插件)可以删除Vue应用程序的HTML,然后将其重新放回原处,以重新定位它。我想运行我的代码,该代码将在重新定位后重新启动VUE。我无法访问弹出插件,无法更改其工作方式。
我已经尝试了此代码来重新开始VUE应用程序:
function initializeApp() {
app = new Vue({
el: '#app'
// other options.
});
}
// This function would run after popup has removed and added the HTML of vue app back.
function afterPopupOpen() {
app.$destroy()
initializeApp()
}
但它行不通。重新启动VUE应用程序后,单击处理程序似乎无法正常工作。
我创建了一个代码沙盒以演示相同的内容:
请注意,在单击重新点击按钮后,计数按钮停止工作。
I'm using Vue not as a SPA, but only as a widget on a page. There is a popup plugin (a jQuery plugin thats working outside of Vue) that deletes the Vue app's HTML and put it back again for the purpose of repositioning it. I want to run my code that would re-initiate the Vue after repositioning is done. I don't have access to the popup plugin and cannot change the way it works.
I have tried this code to reinitialize the Vue App:
function initializeApp() {
app = new Vue({
el: '#app'
// other options.
});
}
// This function would run after popup has removed and added the HTML of vue app back.
function afterPopupOpen() {
app.$destroy()
initializeApp()
}
But it doesn't work. After re-initiating the Vue app click handlers don't seem to work.
I have created a code sandbox to demonstrate the same: https://codesandbox.io/s/vue-app-reinitialize-example-qcovs4?file=/index.html
Notice that the counter button stops working after the Re-initialise button is clicked.
发布评论