Layout | vue | vue element admin example
Theoveralllayoutofthepageistheoutermostframestructureofaproductandoftenincludesnavigation,sidebars,breadcrumbs,andcontent.Tounderstandaadminproject,firstunderstanditsbasiclayout.@iswebpacksalias[1].Ifdontunderstandpleasestudyityourself.Mostofthepagesinvue-element-adminarebasedonthislayout,exceptthatindividualpagessuchas:login,404,401,etc.,donotusethislayout.Itisalsoeasyifyouwanttohavemultiplelayoutsinaproject,aslongasyouchoosedifferentlayoutcomponentinthefirst-levelrouting.Thisusesvue-router...
The overall layout of the page is the outermost frame structure of a product and often includes navigation, sidebars, breadcrumbs, and content. To understand a admin project, first understand its basic layout.
@ is webpacks alias[1]. If dont understand please study it yourself.
Most of the pages in vue-element-admin are based on this layout, except that individual pages such as: login , 404, 401 , etc., do not use this layout. It is also easy if you want to have multiple layouts in a project, as long as you choose different layout component in the first-level routing.
This uses vue-router routing nesting[2], so in general, adding or modifying a page will only affect the main body of app-main. Other content in the layout, such as: the sidebar or navigation bar will not change with your main page.
app-mainHere is a layer of keep-alive outside the app-main is mainly to cache <router-view>, with the tabs-view tab navigation of the page, if ...