xiamen-sb-uniapp/pages/search/search.vue

<template>
    <view>
        <view class="px3 py2 p-fixed left0 right0 bg-color-white ">
            <u-search placeholder="请输入名称或设备编号" v-model="keyword" @search="search" @custom="search">
            </u-search>
        </view>
        <view style="padding-top: 104rpx;">
            <template v-if="listData.length > 0">
                <view class="py2 px3 border-bottom" v-for="(item, index) in listData" :key="index"
                    @click="handleBack(item)">
                    <view class="one-ellipsis f-size-30 text-color-3">{{ item.name }}{{ item.model ? '（' + item.model +
                        '）' : '' }}</view>
                    <view class="f-size-26 text-color-6 mt-1">编号：{{ item.no || '无' }}　位置：{{ item.cph || '无' }}</view>
                </view>
                <view class="py3">
                    <u-loadmore :status="status" />
                </view>
            </template>
            <template v-else>
                <view class="empty">
                    <u-empty text="暂无数据" mode="list"></u-empty>
                </view>
            </template>

        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            keyword: '',
            listData: [],
            status: 'loadmore',
            page: 1,
            limit: 20,
            loadMore: true
        }
    },
    onLoad() {
        this.initData()
    },
    onPullDownRefresh() {
        // 请求结束取消刷新
        this.page = 1;
        this.loadMore = true;
        this.listData = [];
        this.initData();
        uni.stopPullDownRefresh();
    },
    onReachBottom() {
        if (this.loadMore) {
            this.page++;
            this.initData();
        }
    },
    methods: {
        handleBack(item) {
            const pages = getCurrentPages();
            const prevPage = pages[pages.length - 2];
            prevPage.sbBackId = item.id
            // prevPage.setData({
            //      "ceshiId":item.id,
            // })
            // console.log(prevPage);
            uni.navigateBack();
        },
        search(value) {
            console.log(value);
            this.page = 1;
            this.loadMore = true;
            this.listData = [];
            this.initData();
        },
        initData() {
            const that = this
            that.status = 'loading';
            this.$Http
                .getSbInfoPage({
                    pageNum: that.page,
                    pageSize: that.limit,
                    filter: -1,
                    keyword: that.keyword
                })
                .then((res) => {
                    const data = res.data.rows;
                    if (data && data.length > 0 && data.length < that.limit) {
                        that.status = 'nomore';
                        that.loadMore = false;
                    } else if (data.length == that.limit) {
                        that.status = 'loadmore';
                    } else {
                        that.status = 'nomore';
                    }
                    that.listData = [...that.listData, ...data];
                    console.log(that.listData);
                })
        }
    }
}
</script>

<style scoped>
page {
    background-color: #FFFFFF;
}
</style>