原創聲明:本文為作者原創,未經允許不得轉載,經授權轉載需注明作者和出處
我想實現上圖這種功能,點擊不同的年份按鈕,在其下方顯示相應內容,其他按鈕下的內容自動隱藏。
我現在的思路是這樣的:
Page({
data: {
riqi:[
“2015”,
“2016”,
“2017”
],
isshow:[],
},
onLoad: function () {
var that=this
var arr1=that.data.riqi
var arr2=that.data.isshow
for(var i =0;i<arr1.length;i++){
arr2[i]=false
}
that.setData({
isshow:arr2
})
},
showjl:function(e){
var id = e.currentTarget.dataset.id
console.log(id)
var that=this
var arr1=that.data.isshow
for(var i=0;i<arr1.length;i++){
arr1[i]=false
}
arr1[id]=true
that.setData({
isshow:arr1
})
console.log(that.data.isshow)
},
})
DATA中兩個數組,一個riqi記錄按鈕的數量和顯示內容,一個isshow控制按鈕下的內容是否顯示。
<block wx:for="{{riqi}}" wx:key="index">
<template is="temp-sj" data="{{item}}" />
</block>
<template name="temp-sj">
<button data-id="{{index}}" bindtap="showjl">{{item}}</button>
<view wx:if="{{isshow}}">
9999999999
</view>
</template>
目前我這種方法肯定是不行的data-id=”{{index}}”這個根本就沒有數據,換成data-id=”{{item}}”,并修改JS文件倒是可以,但<view wx:if="{{isshow}}">也不行,<view wx:if="{{isshow[item]}}">也不行。