如何將由vue編寫的小部件嵌入到vue webapp中

我正在用Vuejs構建網站。我有這樣如何將由vue編寫的小部件嵌入到vue webapp中

代碼app.js

new Vue({ 
    el: '.page-wrapper', 
    ... 
})

的index.html

<body> 
    <div class="page-wrapper"> 
     <!-- content--> 
    </div> 
</body>

現在我要將這是由Vuejs建立像

<div id="widget"></div> 
<script src="https://widget.com/widget.js"></script>

一個widget

裏面的page-wrapper類。我試圖將script標籤放在原始Vue組件外，但小部件的內容仍未呈現。

我是Vuejs的新手，有誰能幫我一個忙嗎？

來源

2017-04-13 theanht1

我只是要好好看看這個刺...

的index.html

<div id="app"> 
    <my-widget></my-widget> 
</div> 

<script src="https://cdn.jsdelivr.net/vue/2.2.6/vue.min.js"></script> 
<script src="https://widget.com/widget.js></script> 
<script src="main.js"></script>

main.js

Vue.component('my-widget', { 
    template: '<div id="widget"></div>' 
}); 

new Vue({ 
    el: '#app' 
});

我Vue的實例#app，我正在加載您的widget.js資產index.html。我可能完全低估了這一點，如果是這樣的話，我很抱歉！

來源

2017-04-13 07:23:06

仍然無法正常工作。我發現一個解決方案是將新的Vue（）分成許多Vue組件 – theanht1

如何將由vue編寫的小部件嵌入到vue webapp中

回答

相關問題