我们上一篇利用自定义连接器实现了搜索功能，但测试发现使用数据列表无法做到数据更新。我们还是按照数据绑定的思路重新开发一下。
自定义连接器方法
module.exports = async function (params, context) { const db = context.database const _ = db.command let result = {data:[]} let total = 0 if(params.keyword ==""){ result =await context.database.collection('lcap-data-26caupXt1-product_vfxwrnn-preview'). skip(params.pageSize*(params.pageNo-1)).limit(params.pageSize) .get(); total = await context.database.collection('lcap-data-26caupXt1-product_vfxwrnn-preview').count(); }else{ result =await context.database.collection('lcap-data-26caupXt1-product_vfxwrnn-preview'). skip(params.pageSize*(params.pageNo-1)).limit(params.pageSize) .where(_.or([ {name:db.RegExp({ regexp: params.keyword, options: 'i', })}, {desc:db.RegExp({ regexp: params.keyword, options: 'i'})} ])) .get(); total = await context.database.collection('lcap-data-26caupXt1-product_vfxwrnn-preview').where(_.or([ {name:db.RegExp({ regexp: params.keyword, options: 'i', })}, {desc:db.RegExp({ regexp: params.keyword, options: 'i'})} ])).count(); // 在这里返回这个方法的结果，需要与出参定义的结构映射 } return { pageNo:params.pageNo, pageSize:params.pageSize, total:total.total, records: result.data }; };
变量定义
自定义连接器做好之后，在变量里需要定义三个变量，分别是pageNo、keyword和productList
组件搭建
变量定义好后，我们往页面中添加一个滚动容器
先往滚动容器里添加一个单行输入组件，修改字段标题为关键字
给单行输入组件设置行为，值改变时赋值给keyword变量
在单行输入组件下，我们增加个普通容器，里边放置一个文本组件
在普通容器上绑定循环展示，绑定我们的productList变量
文本组件的文本内容从循环变量里绑定
目前没有查询出数据来，是因为pageNo初始为0，我们修改一下，设定初始值为1
为了好看一点，我们给文本组件设置高度，并且设置一个边框
因为需要实现一下分页的效果，我们多录入一些数据，将每页显示的条数更改为5
实现分页
组件配置好之后，我们需要考虑如何实现分页的效果。首先是怎么触发分页，因为是在手机上浏览，我们一般是需要触底的时候实现分页的效果。因此需要在滚动容器上增加触底的事件，我们触底时先将pageNo+1
页码+1之后，我们就需要用新的页码再去调用自定义连接器，获取最新的数据
获取数据成功之后，我们再给列表数据productList重新赋值一下，将新获取到的数据追加进来就实现了分页的效果
{ ...$page.dataset.state.productList, records:$page.dataset.state.prodcutList?.records?.concat(event.detail?.records) }
测试时候发现触底没法触发事件，原来需要给滚动容器设置一个默认的高度才可以
设置高度后，如果往下拉，分页的数据会追加到原来的集合中
总结
如果使用数据列表容器，设置比较简单，无需编写过多的代码。但是如果使用自定义连接器就不太好使，就得我们自己使用滚动容器实现一下分页的效果，方法比较多，需要多多实践才可以。
