最近写了很多动态添加类名或者tab标签切换的表达式，遇到过很多的坑，下面为大家分享一下我遇到的几种。

v-show以及微信wx:if的使用（以这两个为例）

v-show

v-show后面可以在引号里面直接写true or false

<span class="rise" v-show="isactive!=1">{{huanbi}}</span>
<span class="rise" v-show="false">{{huanbi}}</span>
<span class="rise" v-show="true">{{huanbi}}</span>

wx:if

wx:if在引号里面必须有{{}}
# 在hexojs中直接写{{}}会抛出环境错误

<view wx:if="{{false}}"  class="Theuser" style="height:85rpx;">
      <label>渠道编号：</label>
      <view style="height:100%;float:right;margin-right:24rpx;line-height:88rpx;">{{qudaocode}}</view>
</view>

注：在使用wx:if时有时候会出现闪现问题，其一先清除默认值，其二要使用全等

v-for与wx:for

v-for

<div class="list"  v-for="item in list" :key="item.id" :price="[item.f_itil_1801090109_006]" :name="[item.f_itil_1801090109_P01]">

如果需要使用索引

<li v-for="item in items">
    {{parentMessage}} - {{$index}} - {{item.message}}
</li>

<div v-for="(index, item) in items">
  {{index}} {{item.message}}
</div>

wx:for

wx:for="{{Alldata}}" wx:key=""
#Alldata 为数组 使用索引时直接用{{index}}即可

三元运算

<div class="btn_date" @click="choose">
            <span class="er" :class="[status==1?'active':'']" :name="1">日</span>
            <span class="er" :class="[status==2?'active':'']" :name="2">周</span>
            <span class="er" :class="[status==3?'active':'']" :name="3">月</span>
            <span class="er" :class="[status==4?'active':'']" :name="4">年</span>
</div>
//简单的点击添加类名

<view class="header" bindtap="choosetype">
            <view class="{{isactive == 1?'active':''}}" data-set="1">全部</view>
            <view class="{{isactive == 2?'active':''}}" data-set="2">待接单</view>
            <view class="{{isactive == 3?'active':''}}" data-set="3">处理中</view>
            <view class="{{isactive == 4?'active':''}}" data-set="4">已完成</view>
</view>

<view class="header" bindtap="choosetype">
            <view class="er {{isactive == 1?'active':''}}" data-set="1">全部</view>
            <view class="er {{isactive == 2?'active':''}}" data-set="2">待接单</view>
            <view class="er {{isactive == 3?'active':''}}" data-set="3">处理中</view>
            <view class="er {{isactive == 4?'active':''}}" data-set="4">已完成</view>
</view>

<view class="header" bindtap="choosetype">
            <view class="{{isactive == 1?'active er':'er'}}" data-set="1">全部</view>
            <view class="{{isactive == 2?'active er':'er'}}" data-set="2">待接单</view>
            <view class="{{isactive == 3?'active er':'er'}}" data-set="3">处理中</view>
            <view class="{{isactive == 4?'active er':'er'}}" data-set="4">已完成</view>
</view>

注：小程序里面不能写2个class会报错，vue可以写

<image src="{{ischoose=='1'?[chec;]:[uncheck]}}"></image>

####
data:{
  chec:'wwqeq',
  uncheck:'sdsadasd'
}

未完待续