Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
zuiqiangwanggong
vue-vben-admin
提交
f81c4019
V
vue-vben-admin
项目概览
zuiqiangwanggong
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
f81c4019
编写于
12月 13, 2020
作者:
V
vben
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
perf(tabs): perf multiple-tabs
上级
27e50b47
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
3 addition
and
95 deletion
+3
-95
src/layouts/default/index.less
src/layouts/default/index.less
+0
-17
src/layouts/default/index.tsx
src/layouts/default/index.tsx
+0
-75
src/layouts/default/useLayoutContext.ts
src/layouts/default/useLayoutContext.ts
+3
-3
未找到文件。
src/layouts/default/index.less
已删除
100644 → 0
浏览文件 @
27e50b47
@import (reference) '../../design/index.less';
.default-layout {
display: flex;
width: 100%;
min-height: 100%;
background: @content-bg;
flex-direction: column;
> .ant-layout {
min-height: 100%;
}
&__main {
margin-left: 1px;
}
}
src/layouts/default/index.tsx
已删除
100644 → 0
浏览文件 @
27e50b47
import
'
./index.less
'
;
import
{
defineComponent
,
unref
,
ref
}
from
'
vue
'
;
import
{
Layout
}
from
'
ant-design-vue
'
;
import
{
createAsyncComponent
}
from
'
/@/utils/factory/createAsyncComponent
'
;
import
LayoutHeader
from
'
./header/LayoutHeader
'
;
import
LayoutContent
from
'
./content/index.vue
'
;
import
LayoutSideBar
from
'
./sider
'
;
import
LayoutMultipleHeader
from
'
./header/LayoutMultipleHeader
'
;
import
{
useHeaderSetting
}
from
'
/@/hooks/setting/useHeaderSetting
'
;
import
{
useMenuSetting
}
from
'
/@/hooks/setting/useMenuSetting
'
;
import
{
createLayoutContext
}
from
'
./useLayoutContext
'
;
import
{
registerGlobComp
}
from
'
/@/components/registerGlobComp
'
;
import
{
createBreakpointListen
}
from
'
/@/hooks/event/useBreakpoint
'
;
import
{
isMobile
}
from
'
/@/utils/is
'
;
const
LayoutFeatures
=
createAsyncComponent
(()
=>
import
(
'
/@/layouts/default/feature/index.vue
'
));
const
LayoutFooter
=
createAsyncComponent
(()
=>
import
(
'
/@/layouts/default/footer/index.vue
'
));
export
default
defineComponent
({
name
:
'
DefaultLayout
'
,
setup
()
{
const
headerRef
=
ref
<
ComponentRef
>
(
null
);
const
isMobileRef
=
ref
(
false
);
createLayoutContext
({
fullHeader
:
headerRef
,
isMobile
:
isMobileRef
});
createBreakpointListen
(()
=>
{
isMobileRef
.
value
=
isMobile
();
});
// ! Only register global components here
// ! Can reduce the size of the first screen code
// default layout It is loaded after login. So it won’t be packaged to the first screen
registerGlobComp
();
const
{
getShowFullHeaderRef
}
=
useHeaderSetting
();
const
{
getShowSidebar
}
=
useMenuSetting
();
return
()
=>
{
return
(
<
Layout
class
=
"default-layout"
>
{
()
=>
(
<>
<
LayoutFeatures
/>
{
unref
(
getShowFullHeaderRef
)
&&
<
LayoutHeader
fixed
=
{
true
}
ref
=
{
headerRef
}
/>
}
<
Layout
>
{
()
=>
(
<>
{
unref
(
getShowSidebar
)
&&
<
LayoutSideBar
/>
}
<
Layout
class
=
"default-layout__main"
>
{
()
=>
(
<>
<
LayoutMultipleHeader
/>
<
LayoutContent
/>
<
LayoutFooter
/>
</>
)
}
</
Layout
>
</>
)
}
</
Layout
>
</>
)
}
</
Layout
>
);
};
},
});
src/layouts/default/useLayoutContext.ts
浏览文件 @
f81c4019
...
@@ -6,12 +6,12 @@ export interface LayoutContextProps {
...
@@ -6,12 +6,12 @@ export interface LayoutContextProps {
isMobile
:
Ref
<
boolean
>
;
isMobile
:
Ref
<
boolean
>
;
}
}
const
layoutContextInjectK
ey
:
InjectionKey
<
LayoutContextProps
>
=
Symbol
();
const
k
ey
:
InjectionKey
<
LayoutContextProps
>
=
Symbol
();
export
function
createLayoutContext
(
context
:
LayoutContextProps
)
{
export
function
createLayoutContext
(
context
:
LayoutContextProps
)
{
return
createContext
<
LayoutContextProps
>
(
context
,
layoutContextInjectK
ey
);
return
createContext
<
LayoutContextProps
>
(
context
,
k
ey
);
}
}
export
function
useLayoutContext
()
{
export
function
useLayoutContext
()
{
return
useContext
<
LayoutContextProps
>
(
layoutContextInjectK
ey
);
return
useContext
<
LayoutContextProps
>
(
k
ey
);
}
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录