设定自定义颜色

先创建一个块       :style的内容是从vuex获取的值

    <div class="color" :style="{ background: $store.state.color }"></div>
    <button @click="changeColor" :style="{ color: $store.state.color }">
      修改主题色
    </button>


    .color{
      width: 300px;
      height: 300px;
      background: red;
    }   

向vuex发送请求

<script>
import { useStore } from "vuex";
export default {
  setup() {
    const store = useStore();
    const changeColor = () => {
      store.commit("changeColor");
    };
    return { changeColor };
  },
};
</script>

在vuex写自定义颜色

  state: {
    color: ''
  },
  mutations: {
    changeColor(state) {
      let color = Math.floor(Math.random() * 16777216).toString(16)
      state.color = '#' + color
    }
  },