vue這么動(dòng)態(tài)引入vue文件？

我需要在vue項(xiàng)目運(yùn)行時(shí)引入新的vue文件，該文件是服務(wù)器生成的通過(guò)ajax請(qǐng)求回去的，請(qǐng)問(wèn)如何實(shí)現(xiàn)這個(gè)功能？

回答

編輯回答

夏木

額

那個(gè)。。剛注意到時(shí).vue文件。。vue文件就不太可行了，因?yàn)関ue文件本身時(shí)經(jīng)過(guò)vue-loader等webpack處理編譯過(guò)的，否則時(shí)沒(méi)辦法識(shí)別包括模板、樣式、es6語(yǔ)法等問(wèn)題。但是如果可以通過(guò)下面的方法來(lái)寫(xiě)vue實(shí)例，模板可以用render函數(shù)來(lái)寫(xiě)，然后動(dòng)態(tài)掛載，應(yīng)該就沒(méi)問(wèn)題了

再更新。。。

剛剛又看了vue官網(wǎng)介紹，runtime+Compiler，可以實(shí)現(xiàn)模板直接html不需要用render，樓主可以研究下
vue編譯器
 vue-el
理論上時(shí)可以實(shí)現(xiàn)的參看vue官網(wǎng)api，Vue.extend介紹
我寫(xiě)的demo

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<div id="app">
    <p>{{ message }}</p>
    <input type="text" v-model="message"/>
    <button @click="dynamicMount">動(dòng)態(tài)掛載vue</button>
    <div id="mount-point">
    </div>
</div>
<script>
new Vue({
    el: '#app',
    data: {
        message:'Hello World!'
    },
    created() {
        this.dynamicMount = function() {
            let Profile = Vue.extend({
            template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
            data: function () {
                return {
                firstName: 'Walter',
                lastName: 'White',
                alias: 'Heisenberg'
                }
            }
            })
            // 創(chuàng)建 Profile 實(shí)例，并掛載到一個(gè)元素上。
            new Profile().$mount('#mount-point')
        }
    }
})
</script>
</body>
</html>

2018年9月9日 00:38

編輯回答

真難過(guò)

vue-router有一個(gè)懶加載功能，你直接用js去解析vue文件是沒(méi)可能的
但是你可以做到的事情是，在打包之后把代碼分割成多塊，需要的時(shí)候才加載

2018年5月28日 00:18

編輯回答

朽鹿

那要看請(qǐng)求的這個(gè)文件有沒(méi)有其它特殊的語(yǔ)法，如果只是html語(yǔ)法和css語(yǔ)法，vue語(yǔ)法，是沒(méi)有問(wèn)題的，如果這個(gè)請(qǐng)求文件的內(nèi)容是一個(gè)組件，那就把文件的內(nèi)容讀出來(lái)直接賦值給頁(yè)面script標(biāo)簽，或者把html代碼直接賦值到vue.extend中的template變量就可以

2017年8月4日 06:25