user routing permissions are realized by returning data from the backend and then finding the corresponding component addRouter. When the component is loaded dynamically, an error is reported all the time, and the component can not be found.
related codes
actions: {
GenerateRoutes({ commit, rootState }) {
return new Promise(resolve => {
let accessedRouters = [];
let menuList = rootState.user.menu;
menuList.forEach(function(item,index,arry){
item.component = Layout;
if(item.children&&item.children.length>=1){
item.children.forEach(function(chItem, chIndex,chArry){
let path = chArry[0].path;
if(typeof chItem.component=="string"){
chItem.component = resolve => require([`../../views/` + chItem.component + `.vue`], resolve);
};
item["redirect"] = item.path+"/"+path;
item["meta"] = { "title": item.title,"icon": item.icon};
chItem["meta"] = { "title": chItem.title}
});
};
})
accessedRouters = menuList;
accessedRouters.push({
path: "*",
redirect: "/404",
hidden: true
});
commit("SET_ROUTERS", accessedRouters)
resolve()
})
}}
later, it is OK to receive the component name with a variable and then splice it. The specific reason is still under study. If you encounter this problem, pay more attention to it, which is tricky enough.
let comName = chItem.component;
if(typeof chItem.component=="string"){
chItem.component = resolve => require([`../../views` + comName + `.vue`], resolve);
};