使用动态绑定 class 的方式实现点击按钮 另一按钮变色

初始代码：

<view class="_box">
                <view class="_select">筛选</view>
                <view class="pay_type">充值类型</view>
                <view class="types">
                    <view class="type" tabindex="0">自充</view>
                    <view class="type" tabindex="0">补助</view>
                </view>
                <view class="sure">确定</view>
            </view>

实现功能：点击自充或补助后 确定的背景颜色变成红色

解决方法： 

要实现点击 "自充" 或 "补助" 后 "确定" 的背景颜色变成红色，你可以使用动态绑定 class 的方式来实现。

首先，在 <view class="_box"> 外面包裹一个 div 或 view 元素，给它一个唯一的 id，例如 id="container"。

接下来，你可以添加一个 data 属性来跟踪用户选择的充值类型，比如 selectedType: ''。

然后，在点击 "自充" 或 "补助" 的事件处理程序中，设置 selectedType 的值为所点击的类型，例如：

methods: {
  selectType(type) {
    this.selectedType = type;
  }
}

在 HTML 中，你可以使用动态绑定的方式来检查 selectedType 的值，并根据它的值动态添加类名来改变 "确定" 的背景颜色。例如：

<view class="_box">
  <view class="_select">筛选</view>
  <view class="pay_type">充值类型</view>
  <view class="types">
    <view :class="['type', { 'active': selectedType === '自充' }]" tabindex="0" @click="selectType('自充')">自充</view>
    <view :class="['type', { 'active': selectedType === '补助' }]" tabindex="0" @click="selectType('补助')">补助</view>
  </view>
  <view class="sure" :class="{ 'active': selectedType }">确定</view>
</view>

在上述代码中，使用了动态绑定的方式来添加类名。 ['type', { 'active': selectedType === '自充' }] 表示在 <view class="type"> 上添加类名 "active" 当且仅当 selectedType 的值等于 "自充"。相同的逻辑也适用于 "补助" 类型。

对于 "确定" 按钮，:class="{ 'active': selectedType }" 表示只有当 selectedType 的值存在（即用户选择了 "自充" 或 "补助" 类型）时，添加类名 "active"。

你可以根据需要自定义类名和颜色样式来实现所需的外观效果。

希望这可以帮助到你！如果有任何进一步的问题，请随时提问。