fix: 修复一些问题

This commit is contained in:
wanchun 2022-06-21 15:45:40 +08:00
parent d97a129693
commit 194eb03526
4 changed files with 29 additions and 26 deletions

View File

@ -198,7 +198,17 @@ const router = new VueRouter({
```
接下来我们看看如何配置 `meta`。在单文件组件中可以通过`<config></config>`定义:
我们使用`defineRouteMeta` 配置 `meta`
```jsx
import { defineRouteMete } from '@fesjs/fes';
defineRouteMeta({
name: "store",
title: "vuex测试"
})
```
当然在单文件组件中,还可以通过`<config></config>`配置 `meta`
```vue
<config>
@ -209,15 +219,10 @@ const router = new VueRouter({
</config>
```
在使用`jsx`或者`tsx`时,可以使用`defineRouteMeta` 定义:
::: tip
推荐使用`defineRouteMete`,有更好的提示。
:::
```jsx
import { defineRouteMete } from '@fesjs/fes';
defineRouteMeta({
name: "store",
title: "vuex测试"
})
```
路由元信息在编译后会附加到路由配置中:

View File

@ -176,14 +176,14 @@ export const layout = (layoutConfig, { initialState }) => ({
- **详情**:页面布局类型,可选有 `side``top``mixin`
### isHeaderFixed
### isFixedHeader
- **类型**`Boolean`
- **默认值**`false`
- **详情**:是否固定头部,不跟随页面滚动。
### isSidebarFixed
### isFixedSidebar
- **类型**`Boolean`
- **默认值**`true`
@ -345,7 +345,7 @@ export const access = {
1. 个性化 layout 配置改为使用传入 navigation
2. renderHeader 改为 renderCustom
3. fixedHeader 改为 isHeaderFixed
3. fixedHeader 改为 isFixedHeader
4. menusConfig 改为 menusProps
5. fixedSideBar 改为 isSidebarFixed
5. fixedSideBar 改为 isFixedSidebar
6. 去掉运行时 logo、header、sidebar 三个区域显示配置,请改为使用 navigation: left-right

View File

@ -1,3 +1 @@
import page from './views/page.vue';
export const Page = page;
export Page from './views/page.vue';

View File

@ -3,7 +3,7 @@
<template v-if="currentNavigation === 'side'">
<f-aside
v-model:collapsed="collapsedRef"
:fixed="isSidebarFixed"
:fixed="isFixedSidebar"
:width="`${sideWidth}px`"
class="layout-aside"
collapsible
@ -24,7 +24,7 @@
:accordion="menuProps?.accordion"
/>
</f-aside>
<f-layout :fixed="isSidebarFixed" :style="sideStyleRef">
<f-layout :fixed="isFixedSidebar" :style="sideStyleRef">
<f-header ref="headerRef" class="layout-header" :fixed="currentFixedHeaderRef">
<div class="layout-header-custom">
<slot name="renderCustom"></slot>
@ -46,7 +46,7 @@
<template v-if="currentNavigation === 'left-right'">
<f-aside
v-model:collapsed="collapsedRef"
:fixed="isSidebarFixed"
:fixed="isFixedSidebar"
:width="`${sideWidth}px`"
class="layout-aside"
collapsible
@ -79,7 +79,7 @@
</div>
</div>
</f-aside>
<f-layout :fixed="isSidebarFixed" :style="sideStyleRef">
<f-layout :fixed="isFixedSidebar" :style="sideStyleRef">
<f-layout :embedded="!multiTabs">
<f-main class="layout-main">
<MultiTabProvider :multiTabs="multiTabs" />
@ -135,7 +135,7 @@
</template>
</f-header>
<f-layout :fixed="currentFixedHeaderRef" :style="headerStyleRef">
<f-aside v-model:collapsed="collapsedRef" :fixed="isSidebarFixed" :width="`${sideWidth}px`" collapsible class="layout-aside">
<f-aside v-model:collapsed="collapsedRef" :fixed="isFixedSidebar" :width="`${sideWidth}px`" collapsible class="layout-aside">
<Menu
class="layout-menu"
:menus="menus"
@ -146,7 +146,7 @@
:accordion="menuProps?.accordion"
/>
</f-aside>
<f-layout :embedded="!multiTabs" :fixed="isSidebarFixed" :style="sideStyleRef">
<f-layout :embedded="!multiTabs" :fixed="isFixedSidebar" :style="sideStyleRef">
<f-main class="layout-main">
<MultiTabProvider :multiTabs="multiTabs" />
</f-main>
@ -209,11 +209,11 @@ export default {
type: String,
default: 'side', // side / top / mixin //
},
isHeaderFixed: {
isFixedHeader: {
type: Boolean,
default: false,
},
isSidebarFixed: {
isFixedSidebar: {
type: Boolean,
default: true,
},
@ -243,11 +243,11 @@ export default {
return props.navigation;
});
const currentFixedHeaderRef = computed(() => props.isHeaderFixed || props.navigation === 'mixin');
const currentFixedHeaderRef = computed(() => props.isFixedHeader || props.navigation === 'mixin');
const headerStyleRef = computed(() => (currentFixedHeaderRef.value ? { top: `${headerHeightRef.value}px` } : null));
const sideStyleRef = computed(() => {
const left = collapsedRef.value ? '48px' : `${props.sideWidth}px`;
return props.isSidebarFixed ? { left } : null;
return props.isFixedSidebar ? { left } : null;
});
onMounted(() => {