小程序view選中添加樣式

做一個充值選擇套餐的頁面，沒有用radio，直接用view做的效果，用radio傳值比較方便。
WXML

<view class='cont'>
        <block wx:for="{{prices}}">
          <view data-select="{{item.select}}" data-price='{{item.price}}' class="{{item.select == priceSelect ? 'active':''}} border" bindtap="choosePrice">
            <view class='conts'>
              <view>{{item.price}}</view>
              <text>{{item.category}}</text>
            </view>
          </view>
        </block>
      </view>

data-price=’{{item.price}}'不需要打印價格出來可去掉。

WXSS

.cont{padding: 10px;padding-right: 0;overflow: hidden;}
.border{width:50%;display: inline-block;text-align: center;margin-bottom: 10px;float: left;}
.conts{background: #fff;border-radius: 5px;border: 1px solid #dedede;margin-right: 10px;padding:10px;}
.conts view{font-size: 24px;border-bottom: 1px dashed #dedede;}
.conts text{font-size: 12px;color: #999;}
.active .conts{color: #33cccc;border: 1px solid #33cccc;}
.active .conts text{color: #33cccc;}

JS

data: {
    prices: [
      { "price": '￥69', "select": 1, "category": '一個月'},
      { "price": '￥699', "select": 2, "category": '一年' },
      { "price": '￥99', "select": 3, "category": '一個月' },
      { "price": '￥999', "select": 4, "category": '一年' },
      { "price": '￥199', "select": 5, "category": '一個月' },
      { "price": '￥1999', "select": 6, "category": '一年' },
      { "price": '￥299', "select": 7, "category": '一個月'},
      { "price": '￥2999', "select": 8, "category": '一年' }
    ],
  },
  choosePrice: function (data) {
    this.setData({//把選中值放入判斷值
      priceSelect: data.currentTarget.dataset.select,
    });
    console.log(data.currentTarget.dataset.price);//打印當前價格，不需要可去掉
  },