<view class="tab-box" >
<van-sticky offset-top="{{ 50 }}">
<van-tabs active="{{ active }}" bind:change="ChangeTab">
<van-tab
wx:for="{{marketList}}"
title="{{item.name}}{{item.code}}"
wx:key="index"
wx:for-index="index"
class="tab"
id="tab{{index}}"
></van-tab>
</van-tabs>
</van-sticky>
</view>
<scroll-view
id="scroller"
class="scroller"
scroll-y
scroll-with-animation="true"
scroll-into-view="{{ intoindex }}"
bindscroll="handelScroll"
>
<view class="contact-main">
<view class="contact-box"
wx:for="{{marketList}}"
wx:for-item="item"
wx:key="index"
data-bean="{{item}}"
id="intoindex{{index}}"
>
<view class="contact-name" id="selected{{index}}" >{{item.name}}{{item.code}}</view>
<view class="contact-view">
<view class="contact-item" wx:for="{{item.stalls}}" wx:for-item="each" wx:key="index" data-bean="{{each}}" bindtap="goDetail">
<view class="item-code">{{each.stallNumber}}</view>
<view class="item-name">{{each.contactName}}</view>
<view class="item-more">
<text >{{each.salesVarieties}}</text>
<!-- <text >{{item.baohan}}</text> -->
</view>
</view>
<view wx:if="{{ item.stalls.length==0 }}" class="none-text">待入驻...</view>
</view>
</view>
</view>
</scroll-view>
// pages/market/market.js
import { doRequestList } from '../../http/marketApi'
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
statusBarHeight: app.globalData.statusBarHeight,
winHeight: '100%',
container:null,
active:0,
toView:"",
marketList:[],
intoindex:"",
scrollHeight:"",
anchorArray:[],
topName:"",
topAddress:"",
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.getMarket()
},
onShow() {
},
goDetail(event){
let itemData= event.currentTarget.dataset.bean;
var shareData = {
eiId:itemData.enterpriseId,
}
const BuildData = JSON.stringify(shareData);
wx.navigateTo({ url: `/pages/ChoseGoods/ChoseGoods?detInfo=`+ encodeURIComponent(BuildData) });
},
// https://www.jianshu.com/p/41f1289cf42d
handelScroll(e){
let scrollTop = e.detail.scrollTop
var _this = this
let scrollArr = _this.data.anchorArray;
for (let i = 0; i < scrollArr.length; i++) {
if(scrollTop >= 0 && scrollTop < scrollArr[0]) {
_this.setData({
active: 0,
});
} else if(scrollTop>=scrollArr[i-1]&&scrollTop<scrollArr[i]){
_this.setData({
active: i,
});
}
}
let query = wx.createSelectorQuery().in(_this);
let heightArr = [];
let h = 0;
query.selectAll('.contact-box').boundingClientRect((react) => {
react.forEach((res) => {
h += res.height;
heightArr.push(h)
})
_this.setData({
anchorArray: heightArr
});
}).exec();
},
getMarket(){
doRequestList("8b188f986f1311eebd9b1c1b0dc7da9c").then((res) => {
let resData = res.data;
console.log(resData)
this.setData({
marketList: resData.areas,
topName:resData.name,
topAddress:resData.address,
})
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
const tabBar = this.getTabBar()
tabBar.setData({
TabBarActive: 0
})
},
ChangeTab(event){
let indexSeled =Number(event.detail.index)
console.log(indexSeled)
this.setData({
intoindex:'intoindex'+indexSeled
})
console.log(this.data.toView)
},
/**
* 生命周期函数--监听页面显示
*/
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})
代码块
网友评论