小程序 列表 list 加载更多 列表 怎么写

import {
  baseURL
} from '../../utils/config.js'
import {
  wx_login,
  request,
  uploadWXUserInfo,
  get_phone,
  isEmpty,
  uploadFile2
} from '../../utils/util.js'
import {
  find_openid_detail,
  xcx_user_update,
  xcx_user_find_id
} from '../../api/xcxUser.js'
import {
  record_list
} from '../../api/record'
import {
  project_list
} from '../../api/project'



const app = getApp();

Page({
  data: {
    baseURL: baseURL, //默认是域名
    openid: "", //用户的openid
    xcxUser: {},
    project_list: [],

    record_list: [],
    loading: false,
    noMore: false,
    hasSearched:false,
    page: 1,
    limit: 8,
  },
  async onLoad(options) {
    await this.load_project();
    await this.load_record();
  },
  async load_record() {
    this.setData({
      loading: true
    });
    var obj = {};
    obj.page = this.data.page;
    obj.limit = this.data.limit;
    record_list(obj).then(res => {
      const list = res.data.data || [];
      const total = res.data.count || 0;
      // 原来的列表 + 新列表 【追加模式】
      let old_list = this.data.record_list;
      let new_list = old_list.concat(list);
      this.setData({
        record_list: new_list,
        total:total,
        page: this.data.page + 1,
        noMore: list.length < this.data.limit,
        loading: false,
        hasSearched: true,
      })
    }).catch(err => {
      this.setData({
        loading: false
      });
      console.error('网络失败', err);
    });
  },
  async load_project() {
    var obj = {};
    obj.page =1;
    obj.limit = 100;
    project_list(obj).then(res => {
      this.setData({
        project_list:res.data.data
      })
    }).catch(err => {
      this.setData({
        loading: false
      });
      console.error('网络失败', err);
    });

  },
  // 下拉刷新
  onPullDownRefresh() {},
  // 上拉加载更多
  onReachBottom() {
    if (this.data.noMore || this.data.loading) return
    this.load_record();
  }
})

<view class="container">


  <!-- 消费记录列表 -->
  <view class="record-section">
    <view class="section-title">操作记录</view>
    <view class="record-list">
      <view class="record-card {{item.type === 1 ? 'record-card--add' : 'record-card--reduce'}}"
        wx:for="{{record_list}}" wx:key="id">
        <view class="record-left">
          <view class="record-user">{{item.xcx_user.true_name || '用户'}}</view>
          <view class="record-meta">
            <text class="record-project">{{item.project}}</text>
            <text class="record-time">{{item.create_time}}</text>
          </view>
          <view class="record-remark" wx:if="{{item.remark}}">{{item.remark}}</view>
          <view class="record-remark">操作人：{{item.xcx_user2.true_name}}</view>
        </view>
        <view class="record-right">
          <text class="record-num {{item.type === 1 ? 'num-add' : 'num-reduce'}}">
            {{item.type === 1 ? '+' : '-'}}{{item.num}}
          </text>
          <text class="record-remain">剩余 {{item.remain_num}}</text>
        </view>
      </view>
    </view>

    <view class="load-more" wx:if="{{loading}}">
      <text>加载中...</text>
    </view>
   
    <view class="load-more" wx:if="{{!loading && noMore &&  record_list.length  != 0}}">
      <text>没有更多了</text>
    </view>

    <!-- 空状态：有搜索词无结果 -->
    <view wx:if="{{hasSearched && record_list.length === 0 && !loading}}" class="load-more">
      <text class="empty-text">❌ 暂无记录</text>
    </view>

  </view>
</view>

什么那个案例没有搜索，下面这个有搜索。

import {
  baseURL
} from '../../utils/config.js'
import {
  xcx_user_list
} from '../../api/xcxUser.js';

Page({
  data: {
    baseURL: baseURL, //默认是域名
    keyword: '',
    hasSearched: false,
    userList: [],
    historyList: [],
    loading: false,
    loadingMore: false,
    noMore: false,
    total: 0,
    page: 1,
    limit: 20,
  },
  onLoad(options) {
    this.loadHistory();
  },
  onShow() {},
  // ===== 搜索历史 =====
  loadHistory() {
    const history = wx.getStorageSync('xcx_user_search_history') || [];
    this.setData({
      historyList: history
    });
  },
  saveHistory(keyword) {
    if (!keyword) return;
    let history = wx.getStorageSync('xcx_user_search_history') || [];
    // 去重并放到最前面
    history = history.filter(item => item !== keyword);
    history.unshift(keyword);
    // 最多保存 10 条
    if (history.length > 10) history = history.slice(0, 10);
    wx.setStorageSync('xcx_user_search_history', history);
    this.setData({
      historyList: history
    });
  },
  clearHistory() {
    wx.removeStorageSync('xcx_user_search_history');
    this.setData({
      historyList: []
    });
  },
  onHistorySearch(e) {
    const keyword = e.currentTarget.dataset.keyword;
    this.setData({
      keyword
    });
    this.doSearch(keyword);
  },
  // ===== 输入 & 搜索 =====
  onInput(e) {
    this.setData({
      keyword: e.detail.value
    });
  },
  clearKeyword() {
    this.setData({
      keyword: '',
      hasSearched: false,
      userList: [],
      page: 1,
      noMore: false
    });
  },
  onSearch() {
    const keyword = this.data.keyword.trim();
    if (keyword.length < 1) {
      wx.showToast({
        title: '请输入搜索关键词',
        icon: 'none'
      });
      return;
    }
    this.doSearch(keyword);
  },
  click_xf(e) {
    let xcx_user_id = e.currentTarget.dataset.id;
    console.log(xcx_user_id);
    let url = "/pages/xcx_user_add_xf/xcx_user_add_xf?xcx_user_id=" + xcx_user_id;
    wx.navigateTo({
      url: url
    })
  },
  click_taocan(e) {
    let xcx_user_id = e.currentTarget.dataset.id;
    console.log(xcx_user_id);
    let url = "/pages/xcx_user_add_taocan/xcx_user_add_taocan?xcx_user_id=" + xcx_user_id;
    wx.navigateTo({
      url: url
    })
  },
  click_view_record(e){
    let xcx_user_id = e.currentTarget.dataset.id;
    console.log(xcx_user_id);
    let url = "/pages/user_record/user_record?xcx_user_id=" + xcx_user_id;
    wx.navigateTo({
      url: url
    })
  }, 
  click_project(e){
 
    let xcx_user_id = e.currentTarget.dataset.id;
    console.log(xcx_user_id);
    let url = "/pages/xcx_user_add_project/xcx_user_add_project?xcx_user_id=" + xcx_user_id;
    wx.navigateTo({
      url: url
    })
  },
  // ===== 核心搜索 =====
  doSearch(keyword) {
    const page = 1;
    this.setData({
      loading: true,
      hasSearched: true,
      page,
      userList: []
    });
    if (keyword) this.saveHistory(keyword);
    const params = {
      page,
      limit: this.data.limit,
      q: keyword
    };
    xcx_user_list(params).then(res => {
      const data = res.data || res || {};
      const list = data.data || [];
      const total = data.count || 0;
      this.setData({
        loading: false,
        userList: list,
        total,
        noMore: list.length < this.data.limit,
      });
    }).catch(err => {
      console.error('搜索用户失败', err);
      this.setData({
        loading: false
      });
      wx.showToast({
        title: '搜索失败',
        icon: 'none'
      });
    });
  },
  // ===== 上拉加载更多 =====
  onReachBottom() {
    if (this.data.loadingMore || this.data.noMore || this.data.loading) return;
    this.loadMore();
  },
  loadMore() {
    const nextPage = this.data.page + 1;
    this.setData({
      loadingMore: true
    });
    const params = {
      page: nextPage,
      limit: this.data.limit
    };
    const keyword = this.data.keyword.trim();
    if (keyword) params.q = keyword;

    xcx_user_list(params).then(res => {
      const data = res.data || res || {};
      const list = data.data || [];

      this.setData({
        loadingMore: false,
        userList: [...this.data.userList, ...list],
        page: nextPage,
        noMore: list.length < this.data.limit,
      });
    }).catch(err => {
      console.error('加载更多失败', err);
      this.setData({
        loadingMore: false
      });
    });
  },

  // ===== 下拉刷新 =====
  onPullDownRefresh() {
    this.setData({
      page: 1,
      noMore: false
    });
    this.doSearch(this.data.keyword.trim());
    wx.stopPullDownRefresh();
  },
})