uni-app怎么通过一个按钮切换两种全局样式

要通过一个按钮切换两种全局样式，您可以使用uni-app提供的全局变量和计算属性来实现。下面是一个示例：

1. 在App.vue文件中定义全局变量`theme`，用来记录当前的主题，以及两种主题的样式：

<template>
  <div :class="theme">
    <!-- 页面内容 -->
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: 'App',
  data() {
    return {
      theme: 'light' // 默认主题为light
    }
  },
  computed: {
    themeStyles() {
      if (this.theme === 'light') {
        return {
          backgroundColor: '#fff',
          color: '#333'
        }
      } else {
        return {
          backgroundColor: '#333',
          color: '#fff'
        }
      }
    }
  }
}
</script>

<style>
/* 全局CSS样式 */
.light button {
  background-color: #ccc;
  color: #333;
}
.dark button {
  background-color: #333;
  color: #ccc;
}
</style>

在上面的示例中，我们定义了一个`theme`变量，用来记录当前的主题。当`theme`为`light`时，应用`light`主题的样式，当`theme`为`dark`时，应用`dark`主题的样式。同时，我们还定义了一个计算属性`themeStyles`，用来返回当前主题的样式。

2. 在需要切换主题的页面中添加一个按钮，并通过点击事件来切换主题：

<template>
  <div>
    <!-- 页面内容 -->
    <button @click="toggleTheme">切换主题</button>
  </div>
</template>

<script>
export default {
  name: 'Page',
  methods: {
    toggleTheme() {
      if (this.$root.theme === 'light') {
        this.$root.theme = 'dark'
      } else {
        this.$root.theme = 'light'
      }
    }
  }
}
</script>

<style>
/* 页面CSS样式 */
button {
  border: none;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
}
</style>

在上面的示例中，我们添加了一个按钮，并通过点击事件来切换主题。在点击事件中，我们通过访问`this.$root.theme`来获取和修改全局变量`theme`的值。当`theme`的值为`light`时，切换为`dark`主题，当`theme`的值为`dark`时，切换为`light`主题。

通过以上步骤，您就可以通过一个按钮来切换两种不同的全局样式了。