search

imouou / BUI-Guide

BUI 是一个跨平台UI开发框架，基于路径式的组件化开发和单页路由SPA，数据驱动，开箱零配置，简单上手，适合独立开发各种 Webapp，App，小程序……
http://www.easybui.com
77 stars 19 forks source link

拖动控件如何自定义动作 #124

Closed Iamasdf closed 3 years ago

Iamasdf commented 5 years ago

我现在遇到需求是聊天记录，一般用户使用习惯是上拉到顶然后加载新的内容，我找了 scroll list pullrefresh 都没有支持这个反过来的操作，拖动控件好像是初始化就要ajax请求，并不能按需调用。要想一开始就模板，然后等待滑动在异步加载的话，加载完不直接执行一次，异步获取记录，这个要怎么实现。

Iamasdf commented 5 years ago

又发现一个bug 现在使用 1.5.4 的Bui 使用scroll 组件要是引入jquery的话，会出现无限加载的情况，

imouou commented 5 years ago

jquery 使用 1.11 的版本没问题的, 无限加载问题一般在模板的渲染上, 不要使用vue之类的一起使用, 这个的原理是根据渲染出来的高度进行渲染, vue是会更晚, 所以拿不到高度就出现多次请求的情况.

查看下 bui.list 的api, 有个comand, 把它改成 prepend 就好, 另外可以结合 modify 每次刷新以后修改下次刷新的参数就好

Iamasdf commented 5 years ago

并没有使用vue 我使用的是3.4.1的jquery, 我现在得同时引用jquery 和 zepto 才不会无限加载. 拖动空间是都不能初始化后不先执行一次异步请求加载，下拉到底部才开始异步加载吗，

imouou commented 5 years ago

只能用一个, jquery 只有在 1.11 才支持, 去掉zepto.js 就好, 控件是一个整体, 没有高度控件都不会有效, 你需要的可能是一个手势自己自由的操作就好.

Iamasdf commented 5 years ago

我用bui.list的实例测试，想要上拉到顶，异步加载到顶部的，依照你说的command 用prepend

id: "#scrollList", url: "/mobile/json.js", pageSize: 6, // 当pageSize 小于返回的数据大小的时候,则认为是最后一页,接口返回的数据最好能返回空数组,而不是null data: {}, //如果分页的字段名不一样,通过field重新定义 field: { page: "page", size: "pageSize", data: "data" }, commandRefresh:'prepend', commandLoad:'prepend', refresh:false, callback: function(e) { // e.target 为你当前点击的元素 // e.currentTarget 为你当前点击的handle 整行 },

效果是到底部，异步加载内容到顶部，还会出现无限加载的情况。 scroll 可以实现上拉倒顶部，然后异步加载内容再追加到顶部吗。 聊天记录这个功能现在使用习惯是从上面追加，上拉到顶部追加。

imouou commented 3 years ago

参考这个例子即可 http://www.easybui.com/demo/#pages/ui_controls/bui.list_chat