wxml：
class="page">
class="li"
bindtap='changetoggle'>
class="left">總數view>
class="right gray" >8view>
view>
class="li"
data-index="0"
bindtap='changetoggle'>
class="left">類別1view>
class="right">3
class="iconfont
}">
text>
view>
view>
hidden="
}">
wx:for="}"
wx:for-item="item"
wx:for-index="index">
class="li bg-gray">
展開1view>
view>
block>
view>
class="li"
data-index="1"
bindtap='changetoggle'>
class="left">類別2view>
class="right">0
class="iconfont
}">
text>
view>
view>
hidden="
}">
wx:for="}"
wx:for-item="item"
wx:for-index="index">
class="li bg-gray">
展開2view>
view>
block>
view>
class="li"
data-index="2"
bindtap='changetoggle'>
class="left">類別3view>
class="right red">2
class="iconfont
}">
text>
view>
view>
hidden="
}">
wx:for="}"
wx:for-item="item"
wx:for-index="index">
class="li bg-gray">
展開3view>
view>
block>
view>
class="li"
data-index="3"
bindtap='changetoggle'>
class="left">類別4view>
class="right red">3
class="iconfont
}">
text>
view>
view>
hidden="
}">
wx:for="}"
wx:for-item="item"
wx:for-index="index">
class="li bg-gray">
展開4view>
class="red">展開4右邊view>
view>
block>
view>
/* 列表詳情 */
.li.bg-gray
.li.icon-xiala ,.icon-shangjiantou
.gray
.red
page(, , ,
],list02: [
],list03: [
, ],
list04: [
, ,
],// 展開摺疊
selectedflag: [false, false, false, false],
},// 展開摺疊選擇
changetoggle:function(e)else
this.setdata()
},})
微信小程式 toptip效果
效果 預設2秒展示,上移動畫隱藏 展示頂部 tip 多次快速呼叫,會覆蓋前次展示 uicomponent.showtoptip function opt if typeof opt string 預設引數,也是外部參考的傳參 var defaultoptions self.setdata self....
微信小程式實現彈幕效果
主要原理是使用的css3的動畫效果。wxml class doommview wx for wx key id wx if class aon style animation first s linear forwards top color text block view class button...
微信小程式實現分頁效果
onready function onshow function onhide function onunload function onpulldownrefresh function onreachbottom function 從上面可以看出下拉重新整理和上拉載入更多的封裝的監聽事件是onpu...