小程式的多列表的展示與隱藏
阿新 • • 發佈:2018-11-05
專案下載:
1.https://download.csdn.net/download/mo3408/10727141
2.下載:https://www.lanzous.com/i24jlvc 密碼:eng4
3.連結:https://share.weiyun.com/5tKPpcO 密碼:kpgvdi(永久)
1.一開始沒有展開前:
展開後是:
頁面的程式碼:
<!--index.wxml--> <!-- 內容資訊 --> <view class='content'> <block wx:for="{{systemList}}"> <!-- 列表 --> <view class='list'> <view class='list_title'>{{item.title}}</view> <view class="list_info {{item.hidden?'hide':'show'}}" >{{item.contentH}}</view> <image src="{{item.image}}" class='down' data-id="{{item.id}}" bindtap='moreInfo'></image> <view class='time'>{{item.time}}</view> </view> <!-- 列表 --> </block> </view>
js如下:
//index.js模擬資料 Page({ /** * 頁面的初始資料 */ data: { isFold: false, nowToggle:'', systemList: [{ id: 0, hidden: true, title: '系統公告', contentH: '關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往,關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往', time: '2018-02-10 18:05:42', image: '../../img/up.png' }, { id: 1, hidden: true, title: '系統公告', contentH: '關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往,關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往', time: '2018-03-15 18:05:42', image: '../../img/up.png' }, { id: 2, hidden: true, title: '系統公告', contentH: '關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往,關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往', time: '2018-05-11 18:05:42', image: '../../img/up.png' }, { id: 3, hidden: true, title: '系統公告', contentH: '關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往,關於2018年月1日前使用平臺消費並處於待退款狀態的的1.如果會員在2018年1月日以前在會員店鋪進行...;2.如果您的退款情況變為已退款狀態,請及時前往請及時前往11111111111111111111', time: '2018-06-14 18:05:42', image:'../../img/up.png' }, ] }, /** * 生命週期函式--監聽頁面載入 */ onLoad: function (options) { }, //展開更多 moreInfo: function (e) { var id=e.currentTarget.dataset.id var systemList=this.data.systemList var that=this var hide=systemList[id].hidden if(systemList[id].image=="../../img/down.png"){ that.setData({ ['systemList['+id+'].hidden']:!hide, ['systemList[' + id + '].image']:'../../img/up.png' }) }else{ that.setData({ ['systemList[' + id + '].hidden']:!hide, ['systemList[' + id + '].image']: '../../img/down.png', }) console.log(systemList) } }, })