layui-vue 0.3.8 发布，基于 vue 3.0 的桌面端组件库

内容简介：更新内容： [新增] 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" // 圆角

在新版本发布的同时，我们开放 物料 板块，用于收录用户投递组件或集成模板，让每一个轮子产生价值 

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。