模板視圖

循環(huán)列表：

<block wx:for="{{items}}">            
    <block  wx:if="{{ti == index}}">
        <text id="{{index}}" class="active" bindtap="getImage">{{item.name}}</text>
    </block>
    <block wx:else>
        <text id="{{index}}" class="" bindtap="getImage">{{item.name}}</text>
    </block>
 </block> 

js邏輯

var datas = {
    //banner圖
    banner: app.imageSource + 'moshi_02.jpg',  
    ti:0,
    items: [
            {
                name:"模式",
                source_path: app.imageSource + 'moshi_02.jpg',
            },
            {
                name: "燈光",
                source_path: app.imageSource + 'picshow_03.jpg',
            },
            {
                name: "空調(diào)",
                source_path: app.imageSource + 'kongtiao_03.jpg',
            },
            {
                name: "電視",
                source_path: app.imageSource + 'tv_02.jpg',
            },
            {
                name: "窗簾",
                source_path: app.imageSource + 'curtain _03.jpg',
            }
        ]
};
Page({
    data: datas,
    getImage: function (event) {
        var that = this;
        var index  = event.currentTarget.id;
        var imgSrc = datas.items[index].source_path;            
        that.setData({
            banner:imgSrc,
            ti: index,
        })
    },  
})

注：三元運算（不循環(huán)）

<text id="{{items[0].index}}" class="{{index==0 ? 'active':''}}" bindtap="getImage">模式</text>       
<text id="{{items[1].index}}" class="{{index==1 ? 'active':''}}" bindtap="getImage">燈光</text>      
<text id="{{items[2].index}}" class="{{index==2 ? 'active':''}}" bindtap="getImage">空調(diào)</text>    
<text id="{{items[3].index}}" class="{{index==3 ? 'active':''}}" bindtap="getImage">電視</text>    
<text id="{{items[4].index}}" class="{{index==4 ? 'active':''}}" bindtap="getImage">窗簾</text>