内容简介:更新内容: [新增] fullscreen 全屏组件。 [新增] icon-picker 颜色选择器。 [新增] config-provider 全局配置, 用于主题与国际化切换。 [修复] container 容器在不同的分辨率无法自适应的问题 [修复] dropdown ...
更新内容:
- [新增] 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" // 圆角
在新版本发布的同时,我们开放 物料 板块,用于收录用户投递组件或集成模板,让每一个轮子产生价值
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- Element 2.14.1 发布,基于 Vue 的桌面端组件库
- Element 2.15.0 发布,基于 Vue 的桌面端组件库
- Element 2.15.2 发布,基于 Vue 的桌面端组件库
- Element 2.13.0 发布,基于 Vue 的桌面端组件库
- Element 2.1.0 发布,基于 Vue 2.0 的桌面端组件库
- Element 2.2.0 发布,基于 Vue 2.0 的桌面端组件库
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。