暗黑模式
暗黑模式
本节将介绍如何在项目中使用 暗黑模式
在rice-ui中,暗黑模式是通过 CSS 变量 实现的
如何启用
rice-ui内部暴露了一个 setTheme
方法设置组件库是否处于暗黑模式, 可以传入dark
或者 light
值。
注意
需要注意的是:目前组件库内部并不会监听 系统/App主题 的变化去动态设置组件库是否处于暗黑模式,需要使用者手动调用setTheme
方法设置。
ts
import { setTheme } from "@/uni_modules/rice-ui"
//使用者需要手动调用 setTheme 方法设置暗黑模式
const setRiceUiTheme = () => {
setTheme(themeState.isDark ? 'dark' : 'light')
}