描述一下:由于之前一直使用Vue都是配置单页面,导致只需要路由跳转就可以了。而今天做跳转时,一头懵。每次都是切换页面,导致我的导航栏每次都是初始化状态。还傻里傻气的每个子级都引用布局组件。(真他妈蠢,想想都醉了)
在做单页面路由时,只需要配置一个跳转路由方式,name或者path (router-link,this.$router.push())等方式。
而在非单页里面:其他内容保持一致,只需要内容切换时。嵌套路由少不了使用。但是第一次用,不熟练还是有很多疑问。尝试理解了下。顺便记录一下,养成习惯。
第一步:
写一个布局页。也就是固定栏目,(导航栏,个人信息栏目啥的),留出一个内容显示区域,里面放上
collapsed = !collapsed" />
import globalMenu from '@/components/pages/GlobalMenu'
import globalFooter from '@/components/pages/GlobalFooter'
import iPadMenu from '@/components/pages/iPadMenu'
import GlobalPageHeader from '@/components/pages/GlobalPageHeader'
export default {
data(){
return {
collapsed: false,
screenstate:false,
visible:false
}
},
mounted(){
console.log(document.body.clientWidth)
},
methods:{
/**
* 调用非PC端 Menu导航栏的子级方法,
*/
showDrawer(){
this.$refs.Ipa