Cloud-Link's blog Cloud-Link's blog
首页
  • 开发资源
  • 人员动态
  • 新人训练
  • 奖惩通报
  • 通讯录
项目资产
  • 快速指南
  • 后端框架
  • 前端框架
  • 业务模块
  • 基础理论
    • 前端
    • 后端
    • 数据库
    • 工具类
  • 常用
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
关于
首页
  • 开发资源
  • 人员动态
  • 新人训练
  • 奖惩通报
  • 通讯录
项目资产
  • 快速指南
  • 后端框架
  • 前端框架
  • 业务模块
  • 基础理论
    • 前端
    • 后端
    • 数据库
    • 工具类
  • 常用
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
关于
  • 指南(guide)

  • 后端框架(framework)

  • 前端框架(frendEnd)

    • 框架介绍(Framework)
    • 开发环境(DevEnvironment)
    • 组件库(Components)
    • 授权认证(Auth)
    • Css 帮助类(CssHelper)
    • 皮肤机制(Skins)
      • 登录定制(Login)
    • 业务模块(modules)

    • 基础理论(fundamentals)

    • 开发框架
    • 前端框架(frendEnd)
    2021-09-15

    皮肤机制(Skins)

    # 前端皮肤使用说明

    DyEnd 提供了皮肤机制,用户可以按照定好的规则来开发自己的皮肤,同时也可以通过 npm 来安装第三方的皮肤组件。

    # 关键术语

    为了更好的理解皮肤机制,大家需要搞清楚一些本框架中的术语

    皮肤:布局相关的内容,如菜单栏的宽度、是否有顶部导航栏等

    主题:色彩有关的内容,如顶部导航栏的背景色、菜单栏的背景色、激活菜单的背景色等等

    字号:大小有关的内容,比如按钮大小、表单控件的大小、文字大小等等

    # 使用方法

    皮肤使用有两种方式:

    如果直接使用前端框架库DyEnd.UI,那么可以按照如下方式使用

    import DyEndUI from 'dyend-ui'
    import DyendSkinsClassics from 'dyend-skins-classics'
    
    // 使用皮肤
    DyEndUI.registerSkin(DyendSkinsClassics)
    
    1
    2
    3
    4
    5

    如果使用了 Cms 模块,那么可以按照如下方式使用

    import WebHost from 'dyend-module-cms'
    import config from './config'
    import Wms from './index'
    
    
    1
    2
    3
    4
    Css 帮助类(CssHelper)
    登录定制(Login)

    ← Css 帮助类(CssHelper) 登录定制(Login)→

    Copyright © 2021-2022 用技术改变世界 | Tungray Cloud-Link
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式
    ×