<view class="box">
? <view class="fenlei">
? ? <scroll-view scroll-y="true" style="height: 100vh;">
? ? ? <view class="{{countindex==index?'active':''}} fenlei-item" wx:for="{{categories}}" wx:key="index" wx:for-item="categories" bindtap="get" data-children="{{categories.children}}" data-index="{{index}}">
? ? ? ? {{categories.name}}
? ? ? </view>
? ? </scroll-view>
? </view>
? <view class="content">
? ? <scroll-view scroll-y="true" style="height: 100vh;">
? ? ? <view wx:for="{{categories}}" wx:key="index" wx:for-item="icon">
? ? ? ? <view wx:for="{{icon.children}}" wx:key="index" wx:for-item="list">
? ? ? ? ? <block wx:if="{{pid==icon.id}}">
? ? ? ? ? ? {{list.name}}
? ? ? ? ? </block>
? ? ? ? </view>
? ? ? </view>
.box {
? display: flex;
}
.fenlei {
? height: 100vh;
? background: #ccc;
}
.content {
? flex: 1;
? height: 100vh;
? background: red;
}
.fenlei-item {
? width: 100%;
? line-height: 150rpx;
? text-align: center;
? background-color: #F7F8FA;
? box-sizing: border-box;
? border-bottom: 1px dashed #ccc;
}
.active {
? border-left: 5px solid rgb(64, 180, 70);
? background: #ccc;
}
Page({
? /**
? * 頁面的初始數(shù)據(jù)
? */
? data: {
? ? categories: [],
? ? children: [],
? ? countindex: 0,
? ? pid: 1
? },
? get(e) {
? ? let index = e.currentTarget.dataset.index
? ? // console.log(e.currentTarget.dataset.id);
? ? // console.log(e.currentTarget.dataset.children);
? ? // console.log(e.currentTarget.dataset.index);
? ? if (this.data.countindex != index) {
? ? ? this.setData({
? ? ? ? countindex: index
? ? ? })
? ? }
? ? this.setData({
? ? ? children: e.currentTarget.dataset.children,
? ? })
? ? this.data.children.forEach(r => {
? ? ? this.setData({
? ? ? ? pid: r.pid
? ? ? })
? ? ? console.log(this.data.pid);
? ? })
? },
? /**
? * 生命周期函數(shù)--監(jiān)聽頁面加載
? */
? onLoad: function (options) {
? ? wx.request({
? ? ? method: 'GET',
? ? ? url: '路徑',
? ? ? header: {
? ? ? ? Authorization: wx.getStorageSync('token')
? ? ? },
? ? ? success: (res => {
? ? ? ? // console.log(res);
? ? ? ? this.setData({
? ? ? ? ? categories: res.data.categories
? ? ? ? })
? ? ? ? // console.log(res.data.categories);
? ? ? })
? ? })
? },
? /**
? * 生命周期函數(shù)--監(jiān)聽頁面初次渲染完成
? */
? onReady: function () {
? },
? /**
? * 生命周期函數(shù)--監(jiān)聽頁面顯示
? */
? onShow: function () {
? },
? /**
? * 生命周期函數(shù)--監(jiān)聽頁面隱藏
? */
? onHide: function () {
? },
? /**
? * 生命周期函數(shù)--監(jiān)聽頁面卸載
? */
? onUnload: function () {
? },
? /**
? * 頁面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作
? */
? onPullDownRefresh: function () {
? },
? /**
? * 頁面上拉觸底事件的處理函數(shù)
? */
? onReachBottom: function () {
? },
? /**
? * 用戶點(diǎn)擊右上角分享
? */
? onShareAppMessage: function () {
? }
})
? ? </scroll-view>
? </view>
</view>
