如何实现微信小程序按钮改变全局颜色可js控制（外部样式）

Question

如何实现wxml不使用内联样式，通过修改page的变量达到改色的效果？或者有更好的方法？

Answer 1

首先你得定义多套样式，比如：

.red {background: red;}
.green {background: green;}

人后在页面里通过变量去控制，页面根节点的类名

<div :class="[bgClass]">
  123
</div>
<button @click="bgClass = 'red'">red</button>
<button @click="bgClass = 'green'">green</button>

data() {
  return {
    bgClass: "red"
  };
}