- scroll-view
<view class='conner'> <scroll-view id='scroll_1' scroll-y='true' scroll-top='{{scroll_top}}'> <view wx:for='{{menuclass_list}}' wx:key='{{item.id}}' class='scroll_1_titleview' wx:for-index='index' style='{{scroll_1_titleview_tapw==index||border_to_show==index?"border-left:8rpx solid #e99857;color:red":""}}' bindtap='scroll_1_titleview_tap' data-id='{{index}}'>{{item.name}}</view> </scroll-view> <view class='back_ccc'></view> <scroll-view id='scroll_2' scroll-y='true' scroll-into-view='{{"into_"+scroll_1_titleview_tap}}' bindscroll='scroll_right'> <view id='scroll_all'> <view class='scroll_2_body' wx:for='{{menuclass_list}}' wx:key='{{item.id}}' wx:for-index='index' id='into_{{index}}'> <view class='scroll_2_title'>{{item.name}}</view> <view class='scroll_2_list'> <navigator hover-class='none' wx:for='{{item.list}}' wx:key='{{item.id}}'> <image class='scroll_2_image' mode='widthFix'></image> <view class='scroll_2_text'>{{item.name}}</view> </navigator> </view> </view> </view> </scroll-view> </view> page{ width:100%; height:100%; } .conner { width: 100%; display: flex; height: 100%; } scroll { height: 100%; } #scroll_1 { min-width: 25%; width: 25%; } .back_ccc{ width:3%; height: 100%; background: #f6f6f6; } #scroll_2 { width: 100%; padding: 0 20rpx; } .scroll_1_titleview { width: 100%; height:10%; display: flex; justify-content: center; align-items: center; font-size: 36rpx; border-bottom:2rpx solid #e2e2e2; border-right:2rpx solid #e2e2e2; box-sizing: border-box; } .scroll_2_title{ text-align: center; } .scroll_2_list{ width: 100%; overflow: hidden; } .scroll_2_list navigator{ width: 33.33333333333%; float: left; text-align: center; } .scroll_2_image{ width: 80%; height: auto; } .scroll_2_text{ font-size: 26rpx; } const db = wx.cloud.database() let scro_top = [] let news_index = 0 let conent = 0; let window_height = '' let scroll_top = '' let times = null let scross = 0 let Dom_top=0 let scroll_true=true let envent=null var conents = [ { "parentId": "10001", "name": "菜式菜品", "list": [ { "parentId": "10001", "id": "1", "name": "家常菜" }, { "id": "2", "name": "快手菜", "parentId": "10001" }, { "id": "3", "name": "创意菜", "parentId": "10001" }, { "id": "4", "name": "素菜", "parentId": "10001" }, { "name": "凉菜", "parentId": "10001", "id": "5" }, { "parentId": "10001", "id": "6", "name": "烘焙" }, { "id": "7", "name": "面食", "parentId": "10001" }, { "id": "8", "name": "汤", "parentId": "10001" }, { "name": "自制调味料", "parentId": "10001", "id": "9" } ] }, { "parentId": "10003", "name": "时令食材", "list": [ { "parentId": "10003", "id": "19", "name": "韭菜" }, { "id": "20", "name": "春笋", "parentId": "10003" }, { "name": "菠菜", "parentId": "10003", "id": "21" }, { "parentId": "10003", "id": "22", "name": "草莓" }, { "id": "23", "name": "樱桃", "parentId": "10003" }, { "id": "24", "name": "苹果", "parentId": "10003" }, { "id": "25", "name": "猪肝", "parentId": "10003" }, { "name": "鲫鱼", "parentId": "10003", "id": "26" }, { "id": "27", "name": "排骨", "parentId": "10003" } ] }, { "parentId": "10004", "name": "功效", "list": [ { "parentId": "10004", "id": "28", "name": "清肺" }, { "id": "29", "name": "护肝", "parentId": "10004" }, { "id": "30", "name": "减肥", "parentId": "10004" }, { "id": "31", "name": "养胃", "parentId": "10004" }, { "id": "32", "name": "丰胸", "parentId": "10004" }, { "id": "33", "name": "排毒", "parentId": "10004" }, { "id": "34", "name": "补血", "parentId": "10004" }, { "id": "35", "name": "补钙", "parentId": "10004" }, { "id": "36", "name": "提高免疫力", "parentId": "10004" }, { "id": "129", "name": "美容", "parentId": "10004" }, { "id": "130", "name": "补肾", "parentId": "10004" }, { "id": "131", "name": "润肺", "parentId": "10004" }, { "id": "133", "name": "滋阴", "parentId": "10004" }, { "id": "135", "name": "抗衰老", "parentId": "10004" }, { "id": "136", "name": "降血压", "parentId": "10004" }, { "id": "137", "name": "祛痘", "parentId": "10004" }, { "id": "139", "name": "防癌", "parentId": "10004" }, { "name": "增肥", "parentId": "10004", "id": "140" }, { "parentId": "10004", "id": "142", "name": "明目" }, { "id": "143", "name": "防辐射", "parentId": "10004" }, { "id": "144", "name": "降血脂", "parentId": "10004" }, { "name": "健脑益智", "parentId": "10004", "id": "145" }, { "id": "147", "name": "增高", "parentId": "10004" }, { "id": "148", "name": "壮阳", "parentId": "10004" }, { "id": "149", "name": "乌发", "parentId": "10004" }, { "id": "150", "name": "调经", "parentId": "10004" }, { "parentId": "10004", "id": "151", "name": "助睡眠" }, { "id": "152", "name": "健脾胃", "parentId": "10004" }, { "id": "153", "name": "润肠通便", "parentId": "10004" } ] }, { "parentId": "10005", "name": "场景", "list": [ { "id": "37", "name": "早餐", "parentId": "10005" }, { "id": "38", "name": "午餐", "parentId": "10005" }, { "id": "39", "name": "下午茶", "parentId": "10005" }, { "id": "40", "name": "晚餐", "parentId": "10005" }, { "id": "41", "name": "夜宵", "parentId": "10005" }, { "name": "踏青", "parentId": "10005", "id": "42" }, { "parentId": "10005", "id": "43", "name": "10分钟内" }, { "id": "44", "name": "10-20分钟", "parentId": "10005" }, { "id": "45", "name": "半小时-1小时", "parentId": "10005" } ] }, { "parentId": "10007", "name": "菜肴", "list": [ { "id": "57", "name": "私房菜", "parentId": "10007" }, { "id": "58", "name": "下酒菜", "parentId": "10007" }, { "id": "61", "name": "小吃", "parentId": "10007" }, { "id": "62", "name": "海鲜", "parentId": "10007" } ] }, { "parentId": "10008", "name": "主食", "list": [ { "id": "64", "name": "饭", "parentId": "10008" }, { "id": "65", "name": "粥", "parentId": "10008" }, { "id": "66", "name": "面", "parentId": "10008" }, { "id": "67", "name": "粉", "parentId": "10008" }, { "id": "68", "name": "饼", "parentId": "10008" }, { "name": "饺子", "parentId": "10008", "id": "69" }, { "parentId": "10008", "id": "70", "name": "馒头" }, { "id": "71", "name": "包子", "parentId": "10008" }, { "id": "72", "name": "卷子", "parentId": "10008" } ] }, { "parentId": "10009", "name": "西点", "list": [ { "name": "蛋糕", "parentId": "10009", "id": "73" }, { "parentId": "10009", "id": "74", "name": "面包" }, { "id": "75", "name": "饼干", "parentId": "10009" }, { "id": "76", "name": "披萨", "parentId": "10009" }, { "id": "77", "name": "零食", "parentId": "10009" }, { "id": "78", "name": "果冻", "parentId": "10009" }, { "id": "79", "name": "糖果", "parentId": "10009" }, { "id": "80", "name": "布丁", "parentId": "10009" }, { "id": "81", "name": "挞类", "parentId": "10009" } ] }, { "parentId": "10010", "name": "汤羹饮品", "list": [ { "id": "82", "name": "羹", "parentId": "10010" }, { "id": "83", "name": "果汁", "parentId": "10010" }, { "id": "84", "name": "炖品", "parentId": "10010" }, { "id": "85", "name": "糖水", "parentId": "10010" }, { "id": "86", "name": "甜品", "parentId": "10010" }, { "id": "87", "name": "沙拉", "parentId": "10010" }, { "name": "饮品", "parentId": "10010", "id": "88" }, { "parentId": "10010", "id": "89", "name": "冰品" } ] }, { "parentId": "10011", "name": "其他菜品", "list": [ { "id": "90", "name": "便当", "parentId": "10011" }, { "id": "91", "name": "烧烤", "parentId": "10011" }, { "id": "92", "name": "寿司", "parentId": "10011" }, { "id": "93", "name": "火锅", "parentId": "10011" }, { "id": "94", "name": "酱汁", "parentId": "10011" }, { "id": "95", "name": "佐料", "parentId": "10011" }, { "id": "96", "name": "拼盘", "parentId": "10011" }, { "id": "97", "name": "杂烩", "parentId": "10011" } ] }, { "parentId": "10012", "name": "人群", "list": [ { "id": "155", "name": "孕妇", "parentId": "10012" }, { "id": "156", "name": "儿童", "parentId": "10012" }, { "id": "157", "name": "幼儿", "parentId": "10012" }, { "id": "158", "name": "老年人", "parentId": "10012" }, { "id": "159", "name": "考生", "parentId": "10012" }, { "id": "160", "name": "产妇", "parentId": "10012" }, { "name": "运动员", "parentId": "10012", "id": "161" }, { "id": "162", "name": "白领", "parentId": "10012" }, { "parentId": "10012", "id": "163", "name": "司机" } ] }, { "parentId": "10013", "name": "疾病", "list": [ { "id": "164", "name": "便秘", "parentId": "10013" }, { "id": "165", "name": "贫血", "parentId": "10013" }, { "id": "166", "name": "腹泻", "parentId": "10013" }, { "id": "167", "name": "感冒", "parentId": "10013" }, { "name": "咳嗽", "parentId": "10013", "id": "168" }, { "id": "169", "name": "甲亢", "parentId": "10013" }, { "parentId": "10013", "id": "170", "name": "痛风" }, { "id": "171", "name": "胃痛", "parentId": "10013" }, { "name": "失眠", "parentId": "10013", "id": "172" }, { "parentId": "10013", "id": "173", "name": "健忘" }, { "id": "174", "name": "骨折", "parentId": "10013" }, { "id": "175", "name": "痔疮", "parentId": "10013" }, { "id": "176", "name": "晕车", "parentId": "10013" }, { "id": "177", "name": "低血糖", "parentId": "10013" }, { "name": "消化不良", "parentId": "10013", "id": "178" }, { "id": "179", "name": "月经不调", "parentId": "10013" }, { "parentId": "10013", "id": "180", "name": "口腔溃疡" }, { "id": "181", "name": "骨质疏松", "parentId": "10013" } ] }, { "name": "日常", "list": [ { "id": "241", "name": "聚会", "parentId": "10020" }, { "parentId": "10020", "id": "242", "name": "熬夜" }, { "id": "243", "name": "单身", "parentId": "10020" }, { "id": "244", "name": "二人世界", "parentId": "10020" } ], "parentId": "10020" } ] Page({ data: { menuclass_list: [], border_to_show: 0, scroll_1_titleview_tap: 0, scroll_top: 0 }, onLoad: function(options) { this.get_menuclass_list() }, onReady: function() { }, onShow: function() { }, onHide: function() { }, onUnload: function() { }, onPullDownRefresh: function() { }, onReachBottom: function() { }, onShareAppMessage: function() { }, get_menuclass_list() { // if (wx.getStorageSync('menuclass_list') == "") { // db.collection('Menu').get().then(res => { // this.setData({ // menuclass_list: res.data[0]['list'] // }) // wx.setStorageSync('menuclass_list', res.data[0]['list']) // }) // } else { // this.setData({ // menuclass_list: wx.getStorageSync('menuclass_list') // }) // console.log(this.data.menuclass_list) // } this.setData({ menuclass_list: conents }) const Dom = wx.createSelectorQuery() //获取右侧滚动高度 Dom.selectAll('.scroll_2_body').boundingClientRect() Dom.selectViewport().scrollOffset() Dom.exec((res) => { res[0].forEach((vlaue, index) => { conent += vlaue.height scro_top.push(conent) }) }) wx.getSystemInfo({ success: (res) => { window_height = res.windowHeight scroll_top = window_height * 0.2 } }) }, scroll_right(e) { //滚动 scross = e.detail.scrollTop let index = 0 for (var i = 0; i < scro_top.length; i++) { if (scross >= scro_top[i - 1]) { index = i } } if (news_index != index) { news_index = index if (news_index >= 5) { this.setData({ border_to_show: news_index, scroll_top: scroll_top }) } else { this.setData({ border_to_show: news_index, scroll_top: 0 }) } } }, scroll_1_titleview_tap(e) { this.setData({ scroll_1_titleview_tap: e.target.dataset.id }) }, }) [图片] 真机运行数据渲染缓慢,滑动右边左边跟着变色,如果是滑动间歇很短的话不明显,如果是就滑动一次,数据渲染是等页面滚动结束才会渲染,这问题怎么解决呀,很着急麻烦帮忙看看
2018-12-02 - 联动菜单
<view class='conner'> <scroll-view id='scroll_1' scroll-y='true' scroll-top='{{scroll_top}}'> <view wx:for='{{menuclass_list}}' wx:key='{{item.id}}' class='scroll_1_titleview' wx:for-index='index' style='{{scroll_1_titleview_tapw==index||border_to_show==index?"border-left:8rpx solid #e99857;color:red":""}}' bindtap='scroll_1_titleview_tap' data-id='{{index}}'>{{item.name}}</view> </scroll-view> <view class='back_ccc'></view> <scroll-view id='scroll_2' scroll-y='true' scroll-into-view='{{"into_"+scroll_1_titleview_tap}}' bindscroll='scroll_right'> <view id='scroll_all'> <view class='scroll_2_body' wx:for='{{menuclass_list}}' wx:key='{{item.id}}' wx:for-index='index' id='into_{{index}}'> <view class='scroll_2_title'>{{item.name}}</view> <view class='scroll_2_list'> <navigator hover-class='none' wx:for='{{item.list}}' wx:key='{{item.id}}'> <image class='scroll_2_image' mode='widthFix'></image> <view class='scroll_2_text'>{{item.name}}</view> </navigator> </view> </view> </view> </scroll-view> </view> page{ width:100%; height:100%; } .conner { width: 100%; display: flex; height: 100%; } scroll { height: 100%; } #scroll_1 { min-width: 25%; width: 25%; } .back_ccc{ width:3%; height: 100%; background: #f6f6f6; } #scroll_2 { width: 100%; padding: 0 20rpx; } .scroll_1_titleview { width: 100%; height:10%; display: flex; justify-content: center; align-items: center; font-size: 36rpx; border-bottom:2rpx solid #e2e2e2; border-right:2rpx solid #e2e2e2; box-sizing: border-box; } .scroll_2_title{ text-align: center; } .scroll_2_list{ width: 100%; overflow: hidden; } .scroll_2_list navigator{ width: 33.33333333333%; float: left; text-align: center; } .scroll_2_image{ width: 80%; height: auto; } .scroll_2_text{ font-size: 26rpx; } const db = wx.cloud.database() let scro_top = [] let news_index = 0 let conent = 0; let window_height = '' let scroll_top = '' let times = null let scross = 0 let Dom_top=0 let scroll_true=true let envent=null var conents = [ { "parentId": "10001", "name": "菜式菜品", "list": [ { "parentId": "10001", "id": "1", "name": "家常菜" }, { "id": "2", "name": "快手菜", "parentId": "10001" }, { "id": "3", "name": "创意菜", "parentId": "10001" }, { "id": "4", "name": "素菜", "parentId": "10001" }, { "name": "凉菜", "parentId": "10001", "id": "5" }, { "parentId": "10001", "id": "6", "name": "烘焙" }, { "id": "7", "name": "面食", "parentId": "10001" }, { "id": "8", "name": "汤", "parentId": "10001" }, { "name": "自制调味料", "parentId": "10001", "id": "9" } ] }, { "parentId": "10003", "name": "时令食材", "list": [ { "parentId": "10003", "id": "19", "name": "韭菜" }, { "id": "20", "name": "春笋", "parentId": "10003" }, { "name": "菠菜", "parentId": "10003", "id": "21" }, { "parentId": "10003", "id": "22", "name": "草莓" }, { "id": "23", "name": "樱桃", "parentId": "10003" }, { "id": "24", "name": "苹果", "parentId": "10003" }, { "id": "25", "name": "猪肝", "parentId": "10003" }, { "name": "鲫鱼", "parentId": "10003", "id": "26" }, { "id": "27", "name": "排骨", "parentId": "10003" } ] }, { "parentId": "10004", "name": "功效", "list": [ { "parentId": "10004", "id": "28", "name": "清肺" }, { "id": "29", "name": "护肝", "parentId": "10004" }, { "id": "30", "name": "减肥", "parentId": "10004" }, { "id": "31", "name": "养胃", "parentId": "10004" }, { "id": "32", "name": "丰胸", "parentId": "10004" }, { "id": "33", "name": "排毒", "parentId": "10004" }, { "id": "34", "name": "补血", "parentId": "10004" }, { "id": "35", "name": "补钙", "parentId": "10004" }, { "id": "36", "name": "提高免疫力", "parentId": "10004" }, { "id": "129", "name": "美容", "parentId": "10004" }, { "id": "130", "name": "补肾", "parentId": "10004" }, { "id": "131", "name": "润肺", "parentId": "10004" }, { "id": "133", "name": "滋阴", "parentId": "10004" }, { "id": "135", "name": "抗衰老", "parentId": "10004" }, { "id": "136", "name": "降血压", "parentId": "10004" }, { "id": "137", "name": "祛痘", "parentId": "10004" }, { "id": "139", "name": "防癌", "parentId": "10004" }, { "name": "增肥", "parentId": "10004", "id": "140" }, { "parentId": "10004", "id": "142", "name": "明目" }, { "id": "143", "name": "防辐射", "parentId": "10004" }, { "id": "144", "name": "降血脂", "parentId": "10004" }, { "name": "健脑益智", "parentId": "10004", "id": "145" }, { "id": "147", "name": "增高", "parentId": "10004" }, { "id": "148", "name": "壮阳", "parentId": "10004" }, { "id": "149", "name": "乌发", "parentId": "10004" }, { "id": "150", "name": "调经", "parentId": "10004" }, { "parentId": "10004", "id": "151", "name": "助睡眠" }, { "id": "152", "name": "健脾胃", "parentId": "10004" }, { "id": "153", "name": "润肠通便", "parentId": "10004" } ] }, { "parentId": "10005", "name": "场景", "list": [ { "id": "37", "name": "早餐", "parentId": "10005" }, { "id": "38", "name": "午餐", "parentId": "10005" }, { "id": "39", "name": "下午茶", "parentId": "10005" }, { "id": "40", "name": "晚餐", "parentId": "10005" }, { "id": "41", "name": "夜宵", "parentId": "10005" }, { "name": "踏青", "parentId": "10005", "id": "42" }, { "parentId": "10005", "id": "43", "name": "10分钟内" }, { "id": "44", "name": "10-20分钟", "parentId": "10005" }, { "id": "45", "name": "半小时-1小时", "parentId": "10005" } ] }, { "parentId": "10007", "name": "菜肴", "list": [ { "id": "57", "name": "私房菜", "parentId": "10007" }, { "id": "58", "name": "下酒菜", "parentId": "10007" }, { "id": "61", "name": "小吃", "parentId": "10007" }, { "id": "62", "name": "海鲜", "parentId": "10007" } ] }, { "parentId": "10008", "name": "主食", "list": [ { "id": "64", "name": "饭", "parentId": "10008" }, { "id": "65", "name": "粥", "parentId": "10008" }, { "id": "66", "name": "面", "parentId": "10008" }, { "id": "67", "name": "粉", "parentId": "10008" }, { "id": "68", "name": "饼", "parentId": "10008" }, { "name": "饺子", "parentId": "10008", "id": "69" }, { "parentId": "10008", "id": "70", "name": "馒头" }, { "id": "71", "name": "包子", "parentId": "10008" }, { "id": "72", "name": "卷子", "parentId": "10008" } ] }, { "parentId": "10009", "name": "西点", "list": [ { "name": "蛋糕", "parentId": "10009", "id": "73" }, { "parentId": "10009", "id": "74", "name": "面包" }, { "id": "75", "name": "饼干", "parentId": "10009" }, { "id": "76", "name": "披萨", "parentId": "10009" }, { "id": "77", "name": "零食", "parentId": "10009" }, { "id": "78", "name": "果冻", "parentId": "10009" }, { "id": "79", "name": "糖果", "parentId": "10009" }, { "id": "80", "name": "布丁", "parentId": "10009" }, { "id": "81", "name": "挞类", "parentId": "10009" } ] }, { "parentId": "10010", "name": "汤羹饮品", "list": [ { "id": "82", "name": "羹", "parentId": "10010" }, { "id": "83", "name": "果汁", "parentId": "10010" }, { "id": "84", "name": "炖品", "parentId": "10010" }, { "id": "85", "name": "糖水", "parentId": "10010" }, { "id": "86", "name": "甜品", "parentId": "10010" }, { "id": "87", "name": "沙拉", "parentId": "10010" }, { "name": "饮品", "parentId": "10010", "id": "88" }, { "parentId": "10010", "id": "89", "name": "冰品" } ] }, { "parentId": "10011", "name": "其他菜品", "list": [ { "id": "90", "name": "便当", "parentId": "10011" }, { "id": "91", "name": "烧烤", "parentId": "10011" }, { "id": "92", "name": "寿司", "parentId": "10011" }, { "id": "93", "name": "火锅", "parentId": "10011" }, { "id": "94", "name": "酱汁", "parentId": "10011" }, { "id": "95", "name": "佐料", "parentId": "10011" }, { "id": "96", "name": "拼盘", "parentId": "10011" }, { "id": "97", "name": "杂烩", "parentId": "10011" } ] }, { "parentId": "10012", "name": "人群", "list": [ { "id": "155", "name": "孕妇", "parentId": "10012" }, { "id": "156", "name": "儿童", "parentId": "10012" }, { "id": "157", "name": "幼儿", "parentId": "10012" }, { "id": "158", "name": "老年人", "parentId": "10012" }, { "id": "159", "name": "考生", "parentId": "10012" }, { "id": "160", "name": "产妇", "parentId": "10012" }, { "name": "运动员", "parentId": "10012", "id": "161" }, { "id": "162", "name": "白领", "parentId": "10012" }, { "parentId": "10012", "id": "163", "name": "司机" } ] }, { "parentId": "10013", "name": "疾病", "list": [ { "id": "164", "name": "便秘", "parentId": "10013" }, { "id": "165", "name": "贫血", "parentId": "10013" }, { "id": "166", "name": "腹泻", "parentId": "10013" }, { "id": "167", "name": "感冒", "parentId": "10013" }, { "name": "咳嗽", "parentId": "10013", "id": "168" }, { "id": "169", "name": "甲亢", "parentId": "10013" }, { "parentId": "10013", "id": "170", "name": "痛风" }, { "id": "171", "name": "胃痛", "parentId": "10013" }, { "name": "失眠", "parentId": "10013", "id": "172" }, { "parentId": "10013", "id": "173", "name": "健忘" }, { "id": "174", "name": "骨折", "parentId": "10013" }, { "id": "175", "name": "痔疮", "parentId": "10013" }, { "id": "176", "name": "晕车", "parentId": "10013" }, { "id": "177", "name": "低血糖", "parentId": "10013" }, { "name": "消化不良", "parentId": "10013", "id": "178" }, { "id": "179", "name": "月经不调", "parentId": "10013" }, { "parentId": "10013", "id": "180", "name": "口腔溃疡" }, { "id": "181", "name": "骨质疏松", "parentId": "10013" } ] }, { "name": "日常", "list": [ { "id": "241", "name": "聚会", "parentId": "10020" }, { "parentId": "10020", "id": "242", "name": "熬夜" }, { "id": "243", "name": "单身", "parentId": "10020" }, { "id": "244", "name": "二人世界", "parentId": "10020" } ], "parentId": "10020" } ] Page({ data: { menuclass_list: [], border_to_show: 0, scroll_1_titleview_tap: 0, scroll_top: 0 }, onLoad: function(options) { this.get_menuclass_list() }, onReady: function() { }, onShow: function() { }, onHide: function() { }, onUnload: function() { }, onPullDownRefresh: function() { }, onReachBottom: function() { }, onShareAppMessage: function() { }, get_menuclass_list() { // if (wx.getStorageSync('menuclass_list') == "") { // db.collection('Menu').get().then(res => { // this.setData({ // menuclass_list: res.data[0]['list'] // }) // wx.setStorageSync('menuclass_list', res.data[0]['list']) // }) // } else { // this.setData({ // menuclass_list: wx.getStorageSync('menuclass_list') // }) // console.log(this.data.menuclass_list) // } this.setData({ menuclass_list: conents }) const Dom = wx.createSelectorQuery() //获取右侧滚动高度 Dom.selectAll('.scroll_2_body').boundingClientRect() Dom.selectViewport().scrollOffset() Dom.exec((res) => { res[0].forEach((vlaue, index) => { conent += vlaue.height scro_top.push(conent) }) }) wx.getSystemInfo({ success: (res) => { window_height = res.windowHeight scroll_top = window_height * 0.2 } }) }, scroll_right(e) { //滚动 scross = e.detail.scrollTop let index = 0 for (var i = 0; i < scro_top.length; i++) { if (scross >= scro_top[i - 1]) { index = i } } if (news_index != index) { news_index = index if (news_index >= 5) { this.setData({ border_to_show: news_index, scroll_top: scroll_top }) } else { this.setData({ border_to_show: news_index, scroll_top: 0 }) } } }, scroll_1_titleview_tap(e) { this.setData({ scroll_1_titleview_tap: e.target.dataset.id }) }, })
2018-12-02 - 小程序联动菜单,真机运行数据渲染缓慢
[图片] [图片] [图片] 开发者工具还可以,真机运行滑动右侧分类,左边变色,变色有延迟
2018-11-05