layui-vue 0.3.8 发布,基于 vue 3.0 的桌面端组件库
更新内容:
- [新增] fullscreen 全屏组件。
- [新增] icon-picker 颜色选择器。
- [新增] config-provider 全局配置, 用于主题与国际化切换。
- [修复] container 容器在不同的分辨率无法自适应的问题
- [修复] dropdown 组件无法嵌套使用的问题。
- [修复] menu 组件导航模式菜单错位问题。
- [修复] quote 引用的 nm 灰色主题失效。
- [升级] icons-vue 1.0.7 版本。
- [升级] layer-vue 1.3.5 版本。
颜色选择器的发布,意味着 layui-vue 对主题的支持。全局 config-provider 配置将为开发者提供更友好的在线主题切换解决方案。
接下来,我们来看如何为现有项目,增加主题切换支持。
<template><lay-config-provider :themeVariable="themeVariable"><router-view></router-view></lay-config-provider></template><script setup>import { ref } from "vue";const themeVariable = ref({"--global-primary-color": "#009688","--global-checked-color": "#5fb878"})</script>
在你看到 ref 关键字时,说明 themeVariable 是具有响应的变量。这意味着对 themeVariable 值的修改,将成为你切换主题的关键。
以下为当前版本可用的主题配置变量,后续我们将开放更细粒度的主题变量
"--global-primary-color": "#009688", // 主题色"--global-normal-color": "#1e9fff", // 通用色"--global-warm-color": "#ffb800", // 警告色"--global-danger-color": "#ff5722", // 危险色"--global-checked-color": "#5fb878", // 选中色"--global-border-radius": "10px" // 圆角
在新版本发布的同时,我们开放 物料 板块,用于收录用户投递组件或集成模板,让每一个轮子产生价值

