1.背景
1.1.要求：頂部有一個tab欄，點開後會存在1級，2級，3級菜單（不論有積極菜單，都要點擊到最後一級纔會選中）
1.2.要求：對於有些數據第一項需要加不限，有些不需要，根據要求自行添加，點擊不限展示原文字，只有點擊不限之外的文字選項纔會放在tab中展示
1.3.要求：對於篩選的部分，裏邊有可以多項選擇的，有些不是多項的，須分開
1.4.要求：有多級的只有點擊了最後一級纔會把選擇的文字添加到tab的對應位置，否則對應的tab位置的文字爲上一次選中的
1.5.要求：每次展開select時，如果之前有選擇過的，則直接展示選中的那個展開狀態，否則不用
2.思考
2.1 當時做的匆忙，都是寫死的，有些是tag_name 和 tag_id ,有些是name 和 id，當時趕項目，所以沒做優化，如果可以，和接口人員商議一下進行統一，就可以使用循環，不用謝name多套了。
2.2 對於1中的1.1，1.2，1.3都比較簡單。對於1.4和1.5，因爲小程序是雙向綁定的，只要值變展示就跟着變，如果想着只用一套變量來存儲，很難實現，所以使用了兩套。
2.3 多增加了一個locationName對象，把最終的展示文字存放在locationName.name中，其它的oneIndex，twoIndex，threeIndex分別對應第幾個最終結果，在點擊tab和內層的時候再把最終的值拿出來比對，展示最終選中的狀態即可。
2.4 在滾動這件事情上使用 scroll-view 標籤比較好使
3.代碼部分
3.1wxml
<!-- 列表篩選 -->
<view class='newHouseTabOut'>
<view class='newHouseTab flex {{maskFlag?"fixedTop":""}}'>
<!---- 區域 ---->
<view class='newHouseTabLi flex alignC {{location.locationName.name?"on":""}} xflb_wz' data-id="0" catchtap="tab">
<view class='newHouseTabLi-msg wmax130 line1'>{{location.locationName.name?location.locationName.name:"位置"}}</view>
<view class='newHouseTabLi-sj'></view>
</view>
<!---- 價格 ---->
<view class='newHouseTabLi flex alignC w170 {{priceIndex>0?"on":""}} xflb_jg' data-id="1" catchtap="tab">
<view class='newHouseTabLi-msg wmax144 line1'>
{{priceIndex>0?pageConfig.price[priceIndex].tag_name:"價格"}}
</view>
<view class='newHouseTabLi-sj'></view>
</view>
<!---- 戶型 ----->
<view class='newHouseTabLi flex alignC {{roomtagIndex>0?"on":""}} xflb_hx' data-id="2" catchtap="tab">
<view class='newHouseTabLi-msg wmax130 line1'>
{{roomtagIndex>0?pageConfig.roomtag[roomtagIndex].tag_name:"戶型"}}
</view>
<view class='newHouseTabLi-sj'></view>
</view>
<!----- 篩選 ----->
<view class='newHouseTabLi flex alignC w90 {{shaixuan.tese.length || shaixuan.leixing > -1 || shaixuan.mianji.length || shaixuan.kaipan > -1 || shaixuan.zhuangxiu > -1?"on":""}} xflb_sx' data-id="3" catchtap="tab">
<view class='newHouseTabLi-msg'>篩選</view>
<view class='newHouseTabLi-sj'></view>
</view>
<!-- 排序 -->
<view class='newHouseTabLi-sx {{paixuIndex>0?"on":""}} xflb_px' data-id="4" catchtap="tab"></view>
</view>
</view>
<!-- 下拉select樣式 -->
<view class='newHouseMask' wx:if="{{maskFlag?true:false}}" catchtap="maskClick">
<!-- 位置 -->
<view class='newHouseMaskLi newHouseMaskLi-locatin' wx:if="{{tabid==0?true:false}}" catchtap="prevent">
<!-- 一級 -->
<scroll-view scroll-y class='newHouseMaskLi-one bg_e5e5e5'>
<block wx:for="{{location.locationOneArr}}" wx:for-index="locationOneI">
<block wx:if="{{locationOneI==0||locationOneI==1}}">
<view class='newHouseMaskLi-oneLi {{location.locationOneIndex==locationOneI?"on":""}}' data-index="{{locationOneI}}" catchtap='clickLocationOne'>
<view class='maxw175 line1'>{{item.tag_name}}</view>
</view>
</block>
<!-- 對於板塊和地鐵做限制，可能會不存在 -->
<block wx:if="{{(locationOneI==2)&&(pageConfig.block.length)}}">
<view class='newHouseMaskLi-oneLi {{location.locationOneIndex==locationOneI?"on":""}}' data-index="{{locationOneI}}" catchtap='clickLocationOne'>
<view class='maxw175 line1'>{{item.tag_name}}</view>
</view>
</block>
<block wx:if="{{(locationOneI==3)&&(pageConfig.metro.length)}}">
<view class='newHouseMaskLi-oneLi {{location.locationOneIndex==locationOneI?"on":""}}' data-index="{{locationOneI}}" catchtap='clickLocationOne'>
<view class='maxw175 line1'>{{item.tag_name}}</view>
</view>
</block>
</block>
</scroll-view>
<!-- 二級,區域 -->
<scroll-view scroll-y class='newHouseMaskLi-two bg_fff' wx:if='{{(location.locationOneIndex==1)&&pageConfig.district.length}}'>
<block wx:for="{{pageConfig.district}}" wx:for-index="locationTwoI">
<view class='newHouseMaskLi-twoLi line1 {{location.locationTwoIndex1==locationTwoI?"on":""}}' data-index='{{locationTwoI}}' data-type='1' data-name="{{item.tag_name}}" catchtap='clickLocationTwo'>{{item.tag_name}}</view>
</block>
</scroll-view>
<!-- 二級，板塊 -->
<scroll-view scroll-y class='newHouseMaskLi-two bg_fff' wx:if='{{(location.locationOneIndex==2)&&pageConfig.block.length}}'>
<block wx:for="{{pageConfig.block}}" wx:for-index="locationTwoI">
<view class='newHouseMaskLi-twoLi line1 {{location.locationTwoIndex2==locationTwoI?"on":""}}' data-index='{{locationTwoI}}' data-type='2' data-name="{{item.tag_name}}" catchtap='clickLocationTwo'>{{item.tag_name}}</view>
</block>
</scroll-view>
<!-- 二級，地鐵 -->
<scroll-view scroll-y class='newHouseMaskLi-two bg_fff' wx:if='{{(location.locationOneIndex==3)&&pageConfig.metro.length}}'>
<block wx:for="{{pageConfig.metro}}" wx:for-index="locationTwoI">
<view class='newHouseMaskLi-twoLi line1 {{location.locationTwoIndex3==locationTwoI?"on":""}}' data-index='{{locationTwoI}}' data-type='3' data-name="{{item.name}}" catchtap='clickLocationTwo'>{{item.name}}</view>
</block>
</scroll-view>
<!-- 三級 -->
<scroll-view scroll-y class='newHouseMaskLi-three bg_fff' wx:if="{{location.locationOneIndex==3&&(location.locationTwoIndex3>-1)}}">
<block wx:for="{{pageConfig.metro[location.locationTwoIndex3].station}}" wx:for-index="locationThreeI">
<view class='newHouseMaskLi-threeLi line1 {{location.locationThreeIndex==locationThreeI?"on":""}}' data-index='{{locationThreeI}}' data-name="{{item.name}}" data-type='3' catchtap='clickLocationThree'>{{item.name}}</view>
</block>
</scroll-view>
</view>
<!-- 價格 -->
<scroll-view scroll-y class='newHouseMaskLi newHouseMaskLi-price' wx:if="{{tabid==1?true:false}}" catchtap="prevent">
<block wx:for="{{pageConfig.price}}" wx:for-index="priceI">
<view class='newHouseMaskLi-price-li {{priceI==priceIndex?"on":""}}' data-index="{{priceI}}" catchtap='clickSelectOne'>{{item.tag_name}}</view>
</block>
</scroll-view>
<!-- 戶型 -->
<scroll-view scroll-y class='newHouseMaskLi newHouseMaskLi-price' wx:if="{{tabid==2?true:false}}" catchtap="prevent">
<block wx:for="{{pageConfig.roomtag}}" wx:for-index="roomtagI">
<view class='newHouseMaskLi-price-li {{roomtagI==roomtagIndex?"on":""}}' data-index="{{roomtagI}}" catchtap='clickSelectOne'>{{item.tag_name}}</view>
</block>
<view class='newHouseMaskLi-price-li on'>不限</view>
</scroll-view>
<!-- 篩選 -->
<view style='width:100%;height:100%;' wx:if="{{tabid==3?true:false}}">
<scroll-view scroll-y class='newHouseMaskLi newHouseMaskLi-sx' style='' catchtap="prevent">
<!-- 特色 -->
<block wx:if="{{pageConfig.recommendTag}}">
<view class='newHouseMaskLi-sx-title'>特色</view>
<view class='newHouseMaskLi-sx-ul clearfix'>
<block wx:for="{{pageConfig.recommendTag}}" wx:for-item="recommendTag">
<view class='newHouseMaskLi-sx-li {{recommendTag.flag==1?"on":""}}' data-index="{{index}}" data-id="{{recommendTag.tag_id}}" data-type="0" catchtap='shaixuanTwo'>
{{recommendTag.tag_name}}
</view>
</block>
</view>
</block>
<!-- 類型 -->
<block wx:if="{{pageConfig.channel}}">
<view class='newHouseMaskLi-sx-title'>類型</view>
<view class='newHouseMaskLi-sx-ul clearfix'>
<view class='newHouseMaskLi-sx-li {{shaixuan.leixing==index?"on":""}}' wx:for="{{pageConfig.channel}}" wx:for-item="channel" catchtap='shaixuanOne' data-type='1' data-index="{{index}}">{{channel.tag_name}}</view>
</view>
</block>
<!-- 面積 -->
<block wx:if="{{pageConfig.mjtag}}">
<view class='newHouseMaskLi-sx-title'>面積</view>
<view class='newHouseMaskLi-sx-ul clearfix'>
<view class='newHouseMaskLi-sx-li {{mjtag.flag==1?"on":""}}' wx:for="{{pageConfig.mjtag}}" wx:for-item="mjtag" data-index="{{index}}" data-type="2" data-id="{{mjtag.tag_id}}" catchtap='shaixuanTwo'>{{mjtag.tag_name}}</view>
</view>
</block>
<!-- 開盤時間 -->
<block wx:if="{{pageConfig.kptag}}">
<view class='newHouseMaskLi-sx-title'>開盤時間</view>
<view class='newHouseMaskLi-sx-ul clearfix'>
<view class='newHouseMaskLi-sx-li {{shaixuan.kaipan==index?"on":""}}' wx:for="{{pageConfig.kptag}}" wx:for-item="kptag" catchtap='shaixuanOne' data-type='3' data-index="{{index}}">{{kptag.tag_name}}</view>
</view>
</block>
<!-- 裝修 -->
<block wx:if="{{pageConfig.decoratetag}}">
<view class='newHouseMaskLi-sx-title'>裝修</view>
<view class='newHouseMaskLi-sx-ul clearfix'>
<view class='newHouseMaskLi-sx-li {{shaixuan.zhuangxiu==index?"on":""}}' wx:for="{{pageConfig.decoratetag}}" wx:for-item="decoratetag" catchtap='shaixuanOne' data-type='4' data-index="{{index}}">{{decoratetag.tag_name}}</view>
</view>
</block>
</scroll-view>
<!-- 底部懸浮 -->
<view class='newHouseMaskLi-sx-btn flex' style='z-index:999'>
<view class='newHouseMaskLi-sx-btn-cancle' catchtap='cancle'>清空</view>
<view class='newHouseMaskLi-sx-btn-confirm' catchtap='confirm'>確定</view>
</view>
</view>
<!-- 排序 -->
<scroll-view scroll-y class='newHouseMaskLi newHouseMaskLi-price' wx:if="{{tabid==4?true:false}}" catchtap="prevent">
<block wx:for="{{pageConfig.paixu}}" wx:for-index="paixuI">
<view class='newHouseMaskLi-price-li {{paixuI==paixuIndex?"on":""}}' data-index="{{paixuI}}" catchtap='clickSelectOne'>{{item.tag_name}}</view>
</block>
</scroll-view>
</view>
3.2wxss
/* 列表篩選 */
.newHouseTabOut {
width: 100%;
height: 80rpx;
}
.newHouseTab {
width: 100%;
height: 80rpx;
box-sizing: border-box;
padding: 0 24rpx;
background-color: #f6f6f6;
z-index: 999;
}
.fixedTop {
position: fixed;
top: 0;
left: 0;
}
.newHouseTabLi {
width: 156rpx;
margin-right: 20rpx;
}
.newHouseTabLi-msg {
font-size: 26rpx;
color: #404040;
line-height: 75rpx;
}
.newHouseTabLi-sj {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAICAYAAAAftBSpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjExMjY5M0EwQzQ4NDExRTlBRjc2QUIxMDJEQjU1QUM4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjExMjY5M0ExQzQ4NDExRTlBRjc2QUIxMDJEQjU1QUM4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTEyNjkzOUVDNDg0MTFFOUFGNzZBQjEwMkRCNTVBQzgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTEyNjkzOUZDNDg0MTFFOUFGNzZBQjEwMkRCNTVBQzgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7j3SwbAAAAVElEQVR42mKcOXOmJwMDw3ogZmcgHWwH4kAmGAOIf5JjAEgfE7oAqQaAOEy4JIg1AN0QYgzCKs+ER+EvYi1gwmNjAJJBeF3IRMDvIIM2EgorgAADACLHHvGu47KWAAAAAElFTkSuQmCC);
background-repeat: no-repeat;
background-size: 17rpx 8rpx;
background-position: center;
width: 17rpx;
height: 75rpx;
margin-left: 10rpx;
}
.newHouseTabLi.on .newHouseTabLi-sj {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAICAYAAAAftBSpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjY5QUEyQjY0QzRBMDExRTlBMjlERTlGQkNGRUY0M0QwIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjY5QUEyQjY1QzRBMDExRTlBMjlERTlGQkNGRUY0M0QwIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NjlBQTJCNjJDNEEwMTFFOUEyOURFOUZCQ0ZFRjQzRDAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NjlBQTJCNjNDNEEwMTFFOUEyOURFOUZCQ0ZFRjQzRDAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz74a4vsAAAAU0lEQVR42mL8X8rgycDAsB6I2RlIB9uBOJAJxgDin+QYANLHhC5AqgEgDhMuCWINQDeEGIOwyjPhUfiLWAuY8NgYgGQQXhcyEfA7yKCNhMIKIMAAaM0emlkSnlEAAAAASUVORK5CYII=);
}
.newHouseTabLi.on .newHouseTabLi-msg {
color: #ff7500;
}
.newHouseTabLi-sx {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjk2REY3NzdBQzQ4NTExRTk5MjlDQjlEMUI3NUE2RkYyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjk2REY3NzdCQzQ4NTExRTk5MjlDQjlEMUI3NUE2RkYyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTZERjc3NzhDNDg1MTFFOTkyOUNCOUQxQjc1QTZGRjIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OTZERjc3NzlDNDg1MTFFOTkyOUNCOUQxQjc1QTZGRjIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz53yOxpAAABQklEQVR42mJ0cHBgwAMkgVgMiC/CBPbv3w+mHR0dGUgBTHjkkoD4IRBfAOJlONQwQx2xhVyL/IB4FhCzAPF3II4EYjks6niAWA+IbcixyByIl0NdWwXEd6Di/AwUAHSLVIB4MxBzAfF0IO5goBJAtkgUiLdD6U1AnMtARQCziAvqE5CPTkLj5C+1LWKEpipzaHz4AvE3BioDJmjK8QTi10g01QEo+X4GYmMg/gTEjxhoBFig9BUGGgMmBjqBUYtGLQIVAvbIyZsWwAladv4HFXG08pEuEK8DYjYgng3E/2hhkSjUEn5oLVBAizjCWQtQ0yJmaM2MtRagpkWToW0NrLUApRZ9hTZeQPGRCcQ/oT65Q04+ugvEH4D4GRa5P0CcAw2iV0AcDo0bnNUEPhAKxOxQ12MD84B4CRD/huYZrAAgwACzkj6mJZhH0AAAAABJRU5ErkJggg==);
background-repeat: no-repeat;
background-size: 26rpx 26rpx;
background-position: center;
width: 50rpx;
height: 75rpx;
margin-right: 0;
}
.newHouseTabLi-sx.on {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjg5OUJCODM1QzRBMTExRTk5NTM3Qjc0Mjc3OEI3QjI3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg5OUJCODM2QzRBMTExRTk5NTM3Qjc0Mjc3OEI3QjI3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODk5QkI4MzNDNEExMTFFOTk1MzdCNzQyNzc4QjdCMjciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODk5QkI4MzRDNEExMTFFOTk1MzdCNzQyNzc4QjdCMjciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6SDGLiAAABWUlEQVR42uyWMUvDQBTH36VFIQidKrg4uerikEUQ3Bx0FVc3QaGLGfwEktVB0F03BxX8DN0sONZBBwe7iGJFtJ6/6CsGTarUOxf9wy93JEf+d7l3ec/YNemlERiGRuGIxMp3FPR4tgTncAK7BWNKEpsGHPVrNA/bUIZ7WITRnHFDMAFT/RhFsPc6W5F1aOr9ivxAH43G4BBC2IINcaSsURWOtT2AVXGorlGoK0lXVNc96bg2MhpVke7HHLTFsQKNnFloZVrnSsP3FibhBi7Ek8ranopnBfJL+jf660axiWA6G94+TGb032nph4Enk3Gu+zAAO2Th58CDSVVNKpoFau73iE/0KQsktuPWKDYlzczvWSCxbR9Rt6m1xlsWSGzLZXjfafGS7scyPOhKmv2cozO4hsucZ0+woonyChYwqee9xHxRQHbP2qDOPr+AjE0axo/0C6vJFwEGABS7Tyz9AQr2AAAAAElFTkSuQmCC);
}
.w90 {
width: 90rpx;
}
.wmax130 {
max-width: 130rpx;
}
.w170 {
width: 170rpx;
}
.wmax144 {
max-width: 144rpx;
}
/* 新房列表 */
.newHouseUl {
padding: 0 36rpx;
}
/* 下拉select樣式 */
.newHouseMask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 990;
font-size: 28rpx;
}
.newHouseMaskLi {
width: 100%;
background-color: #fff;
padding-top: 80rpx;
box-sizing: border-box;
position: relative;
}
.newHouseMaskLi-locatin, .newHouseMaskLi-price {
height: 588rpx;
}
.newHouseMaskLi-one {
width: 100%;
height: 588rpx;
}
.bg_e5e5e5 {
background-color: #e5e5e5;
}
.newHouseMaskLi-oneLi, .newHouseMaskLi-price-li {
height: 88rpx;
line-height: 88rpx;
}
.newHouseMaskLi-price-li {
text-align: center;
}
.newHouseMaskLi-oneLi {
}
.maxw175 {
max-width: 175rpx;
box-sizing: border-box;
padding-left: 50rpx;
}
.newHouseMaskLi-oneLi.on, .newHouseMaskLi-price-li.on {
background-color: #fff;
color: #ff7500;
}
.newHouseMaskLi-two, .newHouseMaskLi-three {
height: 100%;
position: absolute;
right: 0;
top: 80rpx;
}
.newHouseMaskLi-two {
width: 575rpx;
}
.newHouseMaskLi-three {
width: 276rpx;
}
.bg_fff {
background-color: #fff;
}
.newHouseMaskLi-twoLi, .newHouseMaskLi-threeLi {
box-sizing: border-box;
padding-left: 40rpx;
height: 88rpx;
line-height: 88rpx;
}
.newHouseMaskLi-twoLi.on, .newHouseMaskLi-threeLi.on {
color: #ff7500;
}
.newHouseMaskLi-twoLi {
width: 295rpx;
}
.newHouseMaskLi-threeLi {
width: 276rpx;
}
/* 篩選 */
.newHouseMaskLi-sx {
height: 100%;
padding-left: 24rpx;
padding-right: 24rpx;
padding-bottom: 95rpx;
}
.newHouseMaskLi-sx-title {
font-size: 30rpx;
color: #404040;
height: 82rpx;
line-height: 82rpx;
}
.newHouseMaskLi-sx-li {
float: left;
width: 160rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
font-size: 24rpx;
color: #404040;
background-color: #f8f8f8;
border-radius: 10rpx;
margin-right: 20rpx;
margin-bottom: 30rpx;
}
.newHouseMaskLi-sx-li:nth-child(4), .newHouseMaskLi-sx-li:nth-child(8),
.newHouseMaskLi-sx-li:nth-child(12) {
margin-right: 0;
}
.newHouseMaskLi-sx-li.on {
background-color: #ff7500;
color: #fff;
}
.newHouseMaskLi-sx-btn {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 94rpx;
border-top: 1rpx solid #e6e6e6;
}
.newHouseMaskLi-sx-btn-cancle, .newHouseMaskLi-sx-btn-confirm {
flex: 1;
text-align: center;
line-height: 94rpx;
font-size: 36rpx;
}
.newHouseMaskLi-sx-btn-cancle {
background-color: #fff;
color: #212121;
}
.newHouseMaskLi-sx-btn-confirm {
background-color: #ff7500;
color: #fff;
}
.max256 {
max-height: 256rpx;
}
/* 彈性盒子 */
.flex {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
display: box;
flex-wrap:wrap;
}
.alignC{
align-items: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-o-align-items: center;
}
.line1{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.clearfix:before, .clearfix:after {
content: '.';
display: block;
visibility: hidden;
font-size: 0;
line-height: 0;
width: 0;
height: 0;
}
.clearfix:after {
clear: both;
}
.clearfix {
zoom: 1;
}
3.3js
var commonData = require('data.js');
Page({
/**
* 頁面的初始數據
*/
data: {
maskFlag: false, // 蒙層
// tab （0-4）分別爲：位置，價格，戶型，篩選，排序
tabid: -1,
// 位置
// 位置的一級菜單
location: {
locationOneArr: [{
id: 0,
tag_name: '不限'
}, {
id: 1,
tag_name: '區域'
}, {
id: 2,
tag_name: '板塊'
}, {
id: 3,
tag_name: '地鐵'
}],
// 位置的名字（並記錄位置，再次展開時使用）
locationName: {
name: '',
oneIndex: 0, // 記錄第一級菜單當前爲第幾個
twoIndex: -1, // 二級菜單當前爲第幾個
threeIndex: -1 // 三級菜單當前爲第幾個
},
locationOneIndex: 0, // 以及菜單爲第幾個（渲染使用）
// 位置的二級菜單（渲染使用）
locationTwoIndex1: -1, // 區域
locationTwoIndex2: -1, // 板塊
locationTwoIndex3: -1, // 地鐵
// 三級菜單
locationThreeIndex: -1, // 地鐵
},
// 配置接口（數據）
pageConfig: {
district: [], // 區域
block: [], // 板塊
metro: [], // 地鐵
price: [], // 價格
recommendTag: [], // 特色
channel: [], // 類型
mjtag: [], // 面積
kptag: [], // 開盤時間
decoratetag: [], // 裝修
paixu: [] // 排序
},
priceIndex: -1, // 價格
roomtagIndex: -1, // 戶型
// 篩選
shaixuan: {
tese: [], // 特色：選中的id
leixing: -1, // 類型：選中的index（因爲需要判斷是否選中，所以用的index而不是id，下同理）
mianji: [], // 面積：選中的id
kaipan: -1, // 開盤時間：選中的index
zhuangxiu: -1, // 裝修：選中的index
},
paixuIndex: -1, // 排序：選中的index
},
/**
* 生命週期函數--監聽頁面加載
*/
onLoad: function(options) {
// 獲取數據
this.getConfig();
},
// tab切換（列表頂部的tab切換）
tab(e) {
var that = this;
var tabid = e.currentTarget.dataset.id;
that.setData({
maskFlag: true,
tabid: tabid
});
// 位置（需要判斷，之前是否有選過的，如果有則切到當前選中的狀態的界面）
var locationName_name = that.data.location.locationName.name;
var locationName_oneIndex = that.data.location.locationName.oneIndex;
var locationName_twoIndex = that.data.location.locationName.twoIndex;
var locationName_threeIndex = that.data.location.locationName.threeIndex;
if (locationName_name) {
// 把區域和板塊相同的部分提取一下
if ((locationName_oneIndex == 1 && locationName_twoIndex > -1) || (locationName_oneIndex == 2 && locationName_twoIndex > -1)) {
that.setData({
'location.locationTwoIndex3': -1,
'location.locationThreeIndex': -1,
})
}
// 區域
if (locationName_oneIndex == 1 && locationName_twoIndex > -1) {
that.setData({
'location.locationOneIndex': locationName_oneIndex,
'location.locationTwoIndex1': locationName_twoIndex,
'location.locationTwoIndex2': -1,
})
}
// 板塊
if (locationName_oneIndex == 2 && locationName_twoIndex > -1) {
that.setData({
'location.locationOneIndex': locationName_oneIndex,
'location.locationTwoIndex1': -1,
'location.locationTwoIndex2': locationName_twoIndex,
})
}
// 地鐵
if (locationName_oneIndex == 3 && locationName_twoIndex > -1 && locationName_threeIndex > -1) {
that.setData({
'location.locationOneIndex': locationName_oneIndex,
'location.locationTwoIndex1': -1,
'location.locationTwoIndex2': -1,
'location.locationTwoIndex3': locationName_twoIndex,
'location.locationThreeIndex': locationName_threeIndex,
})
}
}
},
// mask隱藏
maskClick() {
var that = this;
that.setData({
maskFlag: false
});
},
// 阻止事件冒泡
prevent() { },
// 位置：點擊一級菜單
clickLocationOne(e) {
var that = this;
var index = e.currentTarget.dataset.index;
that.setData({
'location.locationOneIndex': index,
});
// 如果點擊不限（清空locationName，初始化二級三級狀態）
if (index == 0) {
that.setData({
'maskFlag': false,
'location.locationTwoIndex1': -1,
'location.locationTwoIndex2': -1,
'location.locationTwoIndex3': -1,
'location.locationThreeIndex': -1,
'location.locationName.name': '',
'location.locationName.oneIndex': 0,
'location.locationName.twoIndex': -1,
'location.locationName.threeIndex': -1,
});
// 重新請求數據
}
},
// 位置：點擊二級菜單
clickLocationTwo(e) {
var that = this;
// 積極菜單
var type = e.currentTarget.dataset.type;
// 當前第幾個
var index = e.currentTarget.dataset.index;
// 名字
var name = e.currentTarget.dataset.name;
// 雖然同爲2級，地鐵的二級和其它的二級不同，需要區分
// 把區域和板塊相同部分合並一下
if ((type == 1) || (type == 2)) {
that.setData({
'location.locationTwoIndex3': -1,
'location.locationThreeIndex': -1,
'location.locationName.name': name,
'location.locationName.oneIndex': type,
'location.locationName.twoIndex': index,
'location.locationName.threeIndex': -1,
'maskFlag': false,
});
}
if (type == 1) {
that.setData({
'location.locationTwoIndex1': index,
'location.locationTwoIndex2': -1,
});
// 重新請求數據
}
if (type == 2) {
that.setData({
'location.locationTwoIndex1': -1,
'location.locationTwoIndex2': index,
});
// 重新請求數據
}
if (type == 3) {
that.setData({
'location.locationTwoIndex3': index
});
if (that.data.location.locationName.twoIndex == that.data.location.locationTwoIndex3) {
that.setData({
'location.locationThreeIndex': that.data.location.locationName.threeIndex
});
} else {
that.setData({
'location.locationThreeIndex': -1
});
}
}
},
// 三級菜單點擊(當前只按照地鐵有三級菜單來寫的)
clickLocationThree(e) {
var that = this;
var index = e.currentTarget.dataset.index;
var name = e.currentTarget.dataset.name;
var type = e.currentTarget.dataset.type;
var locationTwoIndex3 = that.data.location.locationTwoIndex3;
that.setData({
'location.locationThreeIndex': index,
'location.locationName.oneIndex': type,
'location.locationName.twoIndex': locationTwoIndex3,
'location.locationName.threeIndex': index,
'location.locationTwoIndex1': -1,
'location.locationTwoIndex2': -1,
'maskFlag': false
});
if (index) {
that.setData({
'location.locationName.name': name,
});
} else {
that.setData({
'location.locationName.name': that.data.pageConfig.metro[that.data.location.locationTwoIndex3].name,
});
}
// 重新請求數據
},
// 價格，戶型，排序
clickSelectOne(e) {
var that = this;
// 1:價格；2：戶型；4：排序
var tabid = that.data.tabid;
var index = e.currentTarget.dataset.index;
if (tabid == 1) {
that.setData({
'priceIndex': index,
});
}
if (tabid == 2) {
that.setData({
'roomtagIndex': index,
});
}
if (tabid == 4) {
that.setData({
'paixuIndex': index,
});
}
// 重新請求數據
that.setData({
'maskFlag': false
});
},
// 篩選
shaixuanOne(e) {
// 1:類型；3：開盤時間；4：裝修
var that = this;
var type = e.currentTarget.dataset.type;
var index = e.currentTarget.dataset.index;
if (type == 1) {
that.setData({
'shaixuan.leixing': index
});
}
if (type == 3) {
that.setData({
'shaixuan.kaipan': index
});
}
if (type == 4) {
that.setData({
'shaixuan.zhuangxiu': index
});
}
},
shaixuanTwo(e) {
// 0:特色；2：面積；
var that = this;
var type = e.currentTarget.dataset.type;
var index = e.currentTarget.dataset.index;
var id = e.currentTarget.dataset.id;
if (type == 0) {
var key = 'pageConfig.recommendTag[' + index + '].flag';
var flag = !that.data.pageConfig.recommendTag[index].flag;
var tese = that.data.shaixuan.tese;
if (flag) {
if (tese.indexOf(id) < 0) {
tese.push(id)
}
} else {
if (tese.indexOf(id) > -1) {
tese.splice(tese.indexOf(id), 1)
}
}
that.setData({
'shaixuan.tese': tese,
[key]: flag
});
}
if (type == 2) {
var key = 'pageConfig.mjtag[' + index + '].flag';
var flag = !that.data.pageConfig.mjtag[index].flag;
var mianji = that.data.shaixuan.mianji;
if (flag) {
if (mianji.indexOf(id) < 0) {
mianji.push(id)
}
} else {
if (mianji.indexOf(id) > -1) {
mianji.splice(mianji.indexOf(id), 1)
}
}
that.setData({
'mianji.tese': mianji,
[key]: flag
});
}
},
// 取消和確認按鈕
cancle(e) {
var that = this;
var recommendTag = that.data.pageConfig.recommendTag.length ? that.data.pageConfig.recommendTag : [];
var mjtag = that.data.pageConfig.mjtag.length ? that.data.pageConfig.mjtag : [];
for (var i = 0; i < recommendTag.length; i++) {
recommendTag[i]['flag'] = 0
}
for (var j = 0; j < mjtag.length; j++) {
mjtag[j]['flag'] = 0
}
that.setData({
shaixuan: {
tese: [],
leixing: -1,
mianji: [],
kaipan: -1,
zhuangxiu: -1,
},
"pageConfig.recommendTag": recommendTag,
"pageConfig.mjtag": mjtag,
'maskFlag': false
});
// 沖洗請求數據
},
// 確認
confirm(e) {
// 搜索並關閉蒙層
var that = this;
// 重新請求數據
that.setData({
'maskFlag': false
});
},
//請求配置
getConfig: function() {
var that = this;
// 獲取數據
var res = commonData.get_data();
// 對數據的處理
var district = res.district.length ? res.district : [];
var block = res.block.length ? res.block : [];
var metro = res.metro.length ? res.metro : [];
for (var i = 0; i < metro.length; i++) {
if (metro[i].station.length) {
metro[i].station.unshift({
id: 0,
name: '不限'
});
}
}
var price = res.price.length ? res.price : [];
price.unshift({
id: 0,
tag_name: '不限'
});
var roomtag = res.roomtag.length ? res.roomtag : [];
roomtag.unshift({
tag_id: 0,
tag_name: '不限'
});
// 篩選
var recommendTag = res.recommendTag.length ? res.recommendTag : [];
var channel = res.channel.length ? res.channel : [];
var mjtag = res.mjtag.length ? res.mjtag : [];
var kptag = res.kptag.length ? res.kptag : [];
var decoratetag = res.decoratetag.length ? res.decoratetag : [];
for (var i = 0; i < recommendTag.length; i++) {
recommendTag[i]['flag'] = 0
}
for (var j = 0; j < mjtag.length; j++) {
mjtag[j]['flag'] = 0
}
// 默認排序，價格由高到低，價格由低到高，關注度由高到低，開盤時間由近到遠
var paixu = [{
tag_id: 0,
tag_name: '默認排序',
}, {
tag_id: 2,
tag_name: '價格由高到低',
}, {
tag_id: 3,
tag_name: '價格由低到高',
}, {
tag_id: 6,
tag_name: '關注度由高到低',
}, {
tag_id: 4,
tag_name: '開盤時間由近到遠',
}];
that.setData({
'pageConfig.district': district,
'pageConfig.block': block,
'pageConfig.metro': metro,
'pageConfig.price': price,
'pageConfig.roomtag': roomtag,
'pageConfig.recommendTag': recommendTag,
'pageConfig.channel': channel,
'pageConfig.mjtag': mjtag,
'pageConfig.kptag': kptag,
'pageConfig.decoratetag': decoratetag,
'pageConfig.paixu': paixu,
});
},
// 參數
getparam() {
var that = this;
var param = {};
if (that.data.location.locationName.name) {
// 區域
if (that.data.location.locationName.oneIndex == 1) {
if (that.data.location.locationName.twoIndex > -1) {
param.dist = that.data.pageConfig.district[that.data.location.locationName.twoIndex].id;
}
}
// 板塊
if (that.data.location.locationName.oneIndex == 2) {
if (that.data.location.locationName.twoIndex > -1) {
param.block = that.data.pageConfig.block[that.data.location.locationName.twoIndex].id;
}
}
// 地鐵
if (that.data.location.locationName.oneIndex == 3) {
if (that.data.location.locationName.twoIndex > -1) {
if (that.data.location.locationName.threeIndex > -1) {
param.dttype_id = that.data.pageConfig.metro[that.data.location.locationName.twoIndex].id;
param.dttag_id = that.data.pageConfig.metro[that.data.location.locationName.twoIndex].station[that.data.location.locationName.threeIndex].id;
}
}
}
}
// 價格
if (that.data.priceIndex > -1) {
param.price = that.data.pageConfig.price[that.data.priceIndex].id;
}
// 戶型
if (that.data.roomtagIndex > -1) {
param.roomtag_id = that.data.pageConfig.roomtag[that.data.roomtagIndex].tag_id;
}
// 特色
if (that.data.shaixuan.tese.length) {
param.tag_id = that.data.shaixuan.tese.join(',')
}
// 類型
if (that.data.shaixuan.leixing > -1) {
param.p = that.data.pageConfig.channel[that.data.shaixuan.leixing].id;
}
// 面積
if (that.data.shaixuan.mianji.length) {
param.mjtagid = that.data.shaixuan.mianji.join(',');
}
// 開盤時間
if (that.data.shaixuan.kaipan > -1) {
param.kptagid = that.data.pageConfig.kptag[that.data.shaixuan.kaipan].tag_id;
}
// 裝修
if (that.data.shaixuan.zhuangxiu > -1) {
param.decoratetagid = that.data.pageConfig.decoratetag[that.data.shaixuan.zhuangxiu].tag_id;
}
// 排序
if (that.data.paixuIndex > -1) {
param.ordered = that.data.pageConfig.paixu[that.data.paixuIndex].tag_id;
}
return param;
},
})
3.4 data.js
function get_data() {
var listaa = { channel: [{ id: 1, tag_name: "住宅" }, { id: 2, tag_name: "寫字樓" }, { id: 3, tag_name: "別墅" }, { id: 4, tag_name: "商業" }, { id: 5, tag_name: "公寓" }], block: [], district: [{ id: 1, tag_name: "濱湖區" }, { id: 2, tag_name: "惠山區" }, { id: 3, tag_name: "錫山區" }, { id: 4, tag_name: "梁溪區" }, { id: 7, tag_name: "新吳區" }, { id: 8, tag_name: "江陰" }, { id: 9, tag_name: "宜興" }, { id: 99, tag_name: "其他" }], price: [{ id: 1, tag_name: "10000元/㎡以下" }, { id: 2, tag_name: "10000-12000元/㎡" }, { id: 3, tag_name: "12000-14000元/㎡" }, { id: 4, tag_name: "14000-16000元/㎡" }, { id: 5, tag_name: "16000-18000元/㎡" }, { id: 6, tag_name: "18000-20000元/㎡" }, { id: 7, tag_name: "20000-25000元/㎡" }, { id: 8, tag_name: "25000-30000元/㎡" }, { id: 9, tag_name: "30000元/㎡以上" }], dist_xy: [{ id: 1, name: "濱湖區" }, { id: 2, name: "惠山區" }, { id: 3, name: "錫山區" }, { id: 4, name: "梁溪區" }, { id: 7, name: "新吳區" }, { id: 8, name: "江陰" }, { id: 9, name: "宜興" }], metro: [{ id: "40", name: "地鐵一號線", station: [{ count: "22", id: "491", name: "堰橋站" }, { count: "4", id: "492", name: "錫北運河站" }, { count: "9", id: "493", name: "西漳站" }, { count: "9", id: "494", name: "天一站" }, { count: "2", id: "495", name: "莊前站" }, { count: "6", id: "496", name: "民豐站" }, { count: "8", id: "508", name: "塘鐵橋站" }, { count: "7", id: "509", name: "金匱公園站" }, { count: "17", id: "510", name: "市民中心站" }, { count: "6", id: "511", name: "文化宮站" }, { count: "9", id: "512", name: "江南大學站" }, { count: "2", id: "513", name: "長廣溪站" }, { count: "2", id: "1935", name: "劉潭站" }, { count: "2", id: "6083", name: "南方泉站（在建）" }, { count: "1", id: "6081", name: "葛埭橋站（在建）" }, { count: "1", id: "6079", name: "雪浪坪站（在建）" }] }, { id: "53", name: "地鐵二號線", station: [{ count: "1", id: "835", name: "梅園開原寺站" }] }, { id: "311", name: "地鐵三號線（建設中）", station: [{ count: "4", id: "6037", name: "蘇廟站" }, { count: 0, id: "6039", name: "錢橋站" }, { count: "5", id: "6041", name: "龍山梢站" }, { count: 0, id: "6043", name: "石門路站" }] }, { id: "363", name: "地鐵四號線（建設中）", station: [{ count: "7", id: "6145", name: "劉潭站" }, { count: "2", id: "6147", name: "廣石路站" }, { count: "2", id: "6149", name: "黃巷站" }] }], recommendTag: [{ tag_id: "1691", tag_name: "投資地產" }, { tag_id: "1703", tag_name: "低密居所" }, { tag_id: "11323", tag_name: "小戶型" }, { tag_id: "50169", tag_name: "品牌房企" }, { tag_id: "50529", tag_name: "現房" }], decoratetag: [{ tag_id: "20323", tag_name: "毛坯" }, { tag_id: "56251", tag_name: "帶裝修" }], roomtag: [{ tag_id: "8", tag_name: "一室" }, { tag_id: "9", tag_name: "二室" }, { tag_id: "10", tag_name: "三室" }, { tag_id: "11", tag_name: "四室" }, { tag_id: "21", tag_name: "五室" }, { tag_id: "22", tag_name: "六室" }], kptag: [{ tag_id: "1", tag_name: "本月開盤" }, { tag_id: "2", tag_name: "下月開盤" }, { tag_id: "3", tag_name: "三月內開盤" }, { tag_id: "4", tag_name: "六月內開盤" }, { tag_id: "5", tag_name: "前三個月已開" }, { tag_id: "6", tag_name: "前六個月已開" }], mjtag: [{ tag_id: "1", tag_name: "60㎡以下" }, { tag_id: "2", tag_name: "60-80㎡" }, { tag_id: "3", tag_name: "80-100㎡" }, { tag_id: "4", tag_name: "100-120㎡" }, { tag_id: "5", tag_name: "120-140㎡" }, { tag_id: "6", tag_name: "140-160㎡" }, { tag_id: "7", tag_name: "160-200㎡" }, { tag_id: "8", tag_name: "200-300㎡" }, { tag_id: "9", tag_name: "300㎡以上" }], nearbytag: [{ id: "1", name: "1km", conf: "1000" }, { id: "2", name: "2.5km", conf: "2500" }, { id: "3", name: "5km", conf: "5000" }, { id: "4", name: "10km", conf: "10000" }], zjtag: [{ tag_id: "59699", tag_name: "50萬以下" }, { tag_id: "59701", tag_name: "50萬-100萬" }, { tag_id: "59703", tag_name: "100萬-150萬" }, { tag_id: "59705", tag_name: "150萬-200萬" }, { tag_id: "59707", tag_name: "200萬-300萬" }, { tag_id: "59711", tag_name: "300萬-400萬" }, { tag_id: "59713", tag_name: "400萬-500萬" }, { tag_id: "59715", tag_name: "500萬以上" }] }
return listaa
}
module.exports = {
get_data: get_data,
}
3.5 效果
4.說明
4.1 寫的比較糙，僅做參考使用
4.2 關鍵點：使用兩套變量