需求是首先通過一個異步的方式獲取一個組件名稱的列表,然后根據(jù)這個列表(字符串?dāng)?shù)組形式)加載這個列表上的組件,然后循環(huán)顯示在頁面上我先照著vue官網(wǎng)上的搞了一個,我現(xiàn)在可以將組件異步加載,但是我不知道該如何進(jìn)行下去了constAsyncComponent=()=>({component:import(`../plugs/Link`)})exportdefault{name:'Menu',components:{},data(){return{plugs:[]}},created(){},computed:{Link:function(){returnAsyncComponent}}}接vv13的回答:上邊的例子是我現(xiàn)在寫的樣子,容易誤導(dǎo)人,我換一種需求的例子目前需求里示例中的Link1、Link2等組件不一定存在,全是從另一個接口中獲取的組件列表例如:exportdefault{name:'Menu',components:{//此處并非固定,所有組件均從后臺添加前臺無法在components中寫死},data(){plugs:[]//此為組件列表},created(){//此處獲取到列表fetch('plugs.php').then((data)=>data.json()).then((data)=>{//data可能是['Link1','Link2','components1','components2',...]所有組件均從后臺添加前臺無法在components中寫死,并且在此假設(shè)所有組件文件都由后臺上傳并存放在`../plugs/Link`目錄下this.plugs=data;})},computed:{}}
2 回答

Cats萌萌
TA貢獻(xiàn)1805條經(jīng)驗 獲得超9個贊
Vue的異步組件實踐有兩種,第一種是路由懶加載將應(yīng)用由路由層分為多個chunk,減小單個入口的打包體積。還有一種就是在Tab頁、彈窗等不需要立即展示的都可以使用異步組件進(jìn)行加載,就拿你的demo來講:
首先加載兩個動態(tài)組件Link1和Link2,通過data中的currentLink來指定動態(tài)組件的名稱,這樣就可以動態(tài)的加載組件。