uView-unix 现在支持暗黑模式了 我们重新规划了所有的设计变量，并通过 CSS Vars 技术实现动态更新主题。

使用方法

在 main.uts 中引入下面的代码

main.uts

import App from './App.uvue'
import { createSSRApp } from 'vue'
import { initTheme } from '@/uni_modules/uview-unix'
import theme from './theme.json'

export function createApp() {
	const app = createSSRApp(App)
	
	app.use(initTheme, theme) 
		
	return {
		app
	}
}

切换主题

您可以在应用运行过程中通过调用 setTheme 方法动态切换主题。

<template>
	<un-page>
        <un-fab 
			:expandable="false" 
			:active="theme == 'dark'" 
			iconSize="25" 
			activeIcon="moon" 
			inactiveIcon="sun" 
			@click="handleClick"
		></un-fab>
	</un-page>
</template>

<script lang="uts" setup>
import { useTheme } from '@/uni_modules/uview-unix'

const { theme, setTheme } = useTheme();

const handleClick = () => {
	setTheme(theme.value == 'dark' ? 'light' : 'dark')
}
</script>