步骤很简单：

1、增加一个组件 ，比如叫 theme ：

2、在theme 中设置 动态的 class

<template>
	<view class="min-w-screen min-h-screen" :class="themeRef == 'dark'? 'bg-dark dark' : 'bg-light'">
		<slot></slot>
	</view>
</template>



我这里加了个多加了个背景色，用 最小宽高为屏幕宽高加了个背景色 ，然后我只加了个 暗黑和非暗黑，需要别的朋友可以自行指定 class

3、在 theme 中 制定切换的策略 ，我这仍旧是暗黑和非暗黑

function changeTheme (theme:string){
	if(theme == 'dark'){
		  wx.setNavigationBarColor({
		    frontColor: '#ffffff',
		    backgroundColor: '#191919',
		    animation: {
		      duration: 200,
		      timingFunc: 'easeIn'
		    }
		  })
	} else {
		  wx.setNavigationBarColor({
		    frontColor: '#000000',
		    backgroundColor: '#f5f6f8',
		    animation: {
		      duration: 200,
		      timingFunc: 'easeIn'
		    }
		  })
		  
	}
}

4、然后使用就非常朴实无华：直接用 theme 包裹内容即可

5、下一篇再讲讲 ：极简的暗黑模式实现方法，不用搞色板等，用好微信的机制，很容易就能完成暗黑和非暗黑的切换。