layout 5.0页面布局
页面展示
一般表单示例代码
<template>
<t-layout>
<NwClientLayoutSiderApp />
<t-layout style="background: #f8f8f8">
<NwClientLayoutHeaderLink>
<template #operations>
<NwRemind :size="25" />
<NwFavorite />
<NWClientToolbar />
</template>
</NwClientLayoutHeaderLink>
<NwClientLayoutHeaderTitle />
<NwClientLayoutContent />
</t-layout>
</t-layout>
</template>
<script setup lang="ts">
import {
NwClientLayoutSiderApp,
NwClientLayoutHeaderLink,
NwRemind,
NwFavorite,
NWClientToolbar,
NwClientLayoutHeaderLink,
NwClientLayoutHeaderTitle,
NwClientLayoutContent
} from "@platform-lib/base"
</script>
layout5.1布局 详解
分为头部,左侧,内容三大模块(如上图)。
头部区域
01为平台logo ----- 在平台管理/系统管理/系统配置中修改
02为自定义链接 ----- 点击加号自定义链接
03为平台消息 NwRemind> ----- 个人消息推送
04为收藏夹信息 NwFavorite ----- 点击可自定义收藏信息
05为个人中心 NWClientToolbar ----- 可修改个人信息
左侧区域 NwClientLayoutSiderApp
06 为一级菜单
07 为二级菜单
页面头部信息 NwClientLayoutHeaderTitle
内容区域 NwClientLayoutContent ---> 上图08(根据左侧菜单获取具体内容)
Last modified: 20 一月 2025