gxwebsoft/aishangjia-uniapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页瀑布流

Browse Source
This commit is contained in:
weicw
2023-08-23 17:56:13 +08:00
parent cbd5aa2a06
commit 13b2d09124
2 changed files with 54 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
pages/house/house.vue
View File

@@ -25,8 +25,8 @@
@change="onSearch"></uni-data-select>
</view>
</view>
<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
@scrolltolower="lower" @scroll="onScroll">
<!-- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
@scrolltolower="lower" @scroll="onScroll"> -->
<uv-waterfall ref="waterfall" v-model="list" left-gap="10" right-gap="10" column-gap="8"
@changeList="changeList">
<!-- 第一列数据 -->
@@ -90,7 +90,7 @@
<!-- </view> -->
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
</u-empty>
</scroll-view>
<!-- </scroll-view> -->
</view>
</template>

58
pages/index/index.vue
View File

@@ -31,7 +31,46 @@
<view class="tabs">
<u-tabs :list="menu" @click="onClick"></u-tabs>
</view>
<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
<uv-waterfall ref="waterfall" v-model="list" left-gap="10" right-gap="10" column-gap="8"
@changeList="changeList">
<!-- 第一列数据 -->
<template v-slot:list1>
<!-- 为了磨平部分平台的BUG，必须套一层view -->
<view class="house-list">
<block v-for="(item,index) in list1" :key="index">
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
<image :src="item.files[0].url" mode="widthFix">
</image>
<view class="info">
<view class="title">{{ item.houseTitle }}</view>
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
<view class="price">{{ item.monthlyRent }}元/月</view>
</view>
</view>
</block>
</view>
</template>
<!-- 第二列数据 -->
<template v-slot:list2>
<!-- 为了磨平部分平台的BUG，必须套一层view -->
<view class="house-list">
<block v-for="(item,index) in list2" :key="index">
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
<image :src="item.files[0].url" mode="widthFix">
</image>
<view class="info">
<view class="title">{{ item.houseTitle }}</view>
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
<view class="price">{{ item.monthlyRent }}元/月</view>
</view>
</view>
</block>
</view>
</template>
</uv-waterfall>
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
</u-empty>
<!-- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
@scrolltolower="lower" @scroll="onScroll">
<view class="house-list" v-if="list.length > 0">
<block v-for="(item,index) in list" :key="index">
@@ -48,7 +87,7 @@
</view>
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
</u-empty>
</scroll-view>
</scroll-view> -->
</view>
</template>
@@ -74,6 +113,8 @@
data() {
return {
list: [],
list1: [],
list2: [],
loadMore: true,
status: '加载更多',
page: 1,
@@ -126,6 +167,9 @@
}
},
methods: {
changeList(e) {
this[e.name].push(e.value);
},
getDict() {
DictApi.getDictionaryOptions({
dictCode: 'region'
@@ -233,11 +277,11 @@
}
.house-list {
width: 700rpx;
margin: 20rpx auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
// width: 700rpx;
// margin: 20rpx auto;
// display: flex;
// flex-wrap: wrap;
// justify-content: space-between;
.item {
margin-bottom: 40rpx;