| | |
| | | <template> |
| | | <view> |
| | | |
| | | <!-- 搜索框 --> |
| | | <view class="square-1"> |
| | | <view class="searchBox"> |
| | | <view class="searchIcon"><uni-icons type="search" size="20" color="#dadada"></uni-icons></view> |
| | | <view class="searchArea"><input type="text" placeholder=" 请输入"></view> |
| | | <view class="closeIcon"><uni-icons type="closeempty" size="20" color="#dadada"></uni-icons></view> |
| | | </view> |
| | | </view> |
| | | <view style="width: 100%;height: 200rpx;background-color: aqua;margin-top: 10rpx;" |
| | | v-for="(item,index) in listData" :key="index"> |
| | | <text>{{index}}</text> |
| | | </view> |
| | | <uni-load-more :status="status" :icon-size="16" :content-text="contentText" /> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | return { |
| | | commonUrl:null, |
| | | listData: [], |
| | | |
| | | reload: false, |
| | | status: 'more', |
| | | contentText: { |
| | | contentdown: '上拉加载更多', |
| | | contentrefresh: '加载中', |
| | | contentnomore: '没有更多' |
| | | } |
| | | }; |
| | | }, |
| | | onLoad() { |
| | |
| | | this.getList() |
| | | }, |
| | | onPullDownRefresh() { |
| | | this.reload = true; |
| | | this.getList() |
| | | }, |
| | | onReachBottom() { |
| | | |
| | | this.status = 'more'; |
| | | this.getList(); |
| | | }, |
| | | methods: { |
| | | // 获取url |
| | |
| | | }, |
| | | getList() { |
| | | let that = this |
| | | console.log(that.commonUrl); |
| | | uni.request({ |
| | | url: that.commonUrl + '/waitPakin/list/auth', |
| | | data:{ |
| | | curr:1, |
| | | limit:16, |
| | | limit:10, |
| | | }, |
| | | header: { |
| | | 'token':uni.getStorageSync('token') |
| | |
| | | let res = result.data |
| | | if (res.code === 200) { |
| | | if (res.data) { |
| | | let list = res.data.records |
| | | that.listData = this.reload ? list : this.listData.concat(list); |
| | | this.reload = false; |
| | | |
| | | } |
| | | } |
| | |
| | | </script> |
| | | |
| | | <style> |
| | | .searchBox { |
| | | position: absolute; |
| | | width: 94%; |
| | | height: 80%; |
| | | top: 0; |
| | | left: 0; |
| | | bottom: 0; |
| | | right: 0; |
| | | margin: auto; |
| | | background-color: #F9F9F9; |
| | | border-radius: 20rpx; |
| | | } |
| | | .searchIcon { |
| | | display: inline-block; |
| | | float: left; |
| | | width: 10%; |
| | | height: 100%; |
| | | text-align: center; |
| | | line-height: 80rpx; |
| | | } |
| | | |
| | | .searchArea { |
| | | display: inline-block; |
| | | float: left; |
| | | width: 80%; |
| | | height: 100%; |
| | | } |
| | | .searchArea input { |
| | | height: 100%; |
| | | font-size: 14px; |
| | | color: #5f5f5f; |
| | | } |
| | | .closeIcon { |
| | | display: inline-block; |
| | | float: left; |
| | | width: 10%; |
| | | height: 100%; |
| | | text-align: center; |
| | | line-height: 80rpx; |
| | | } |
| | | </style> |