uni-app引用mescroll-uni的简单示例

电玩女神 2022-11-20 12:56 420阅读 0赞

<template>
    	<view>
    		<mescroll-uni top="0" bottom="0" @down="downCallback" @up="upCallback">
    		
    		</mescroll-uni>
    	</view>
    </template>
    
    <script>
    	import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
    	export default {
        
    		components: {
        
    			MescrollUni
    		},
    		data() {
        
    			return {
        
    				list: []
    			}
    		},
    		onLoad() {
        
    			let that = this;
    		},
    		methods: {
        
    			/*下拉刷新*/
    			downCallback: function(mescroll) {
        
    				mescroll.resetUpScroll()
    			},
    			/*上拉加载的回调: mescroll携带page的参数, 其中num:当前页 从1开始, size:每页数据条数,默认10 */
    			upCallback: function(mescroll) {
        
    				this.getListDataFromNet(mescroll.num, mescroll.size, (curPageData) => {
        
    					mescroll.endSuccess(curPageData.length);
    					//设置列表数据
    					if (mescroll.num == 1) this.list = [];
    					this.list = this.list.concat(curPageData);
    				}, () => {
        
    					mescroll.endErr();
    				})
    			},
    			getListDataFromNet: function(pageNum, pageSize, successCallback, errorCallback) {
        
    				//请求后台接口
    				api.post('', {
        pageNo: pageNum,pageSize: pageSize}, function(data) {
        
    					successCallback && successCallback(data);
    				})
    			}
    		}
    	}
    </script>
    
    <style></style>

发表评论取消回复

表情：

评论列表（有 0 条评论，420人围观）

还没有评论，来说两句吧...

相关阅读

相关理解Java中的弱引用和软引用示例

在Java中，弱引用（WeakReference）和软引用（SoftReference）主要用于管理GC回收的内存对象。 1. 弱引用（WeakReference）： - 弱

分手后的思念是犯贱/ 2024年10月15日 02:21/ 0 赞/ 108 阅读

相关简单示例：Java中null引用异常处理

在Java编程中，`null`引用异常是一种常见的运行时错误。当你试图访问一个对象的属性或调用它的方法，但这个对象是`null`，就会出现这种异常。下面是一个简单的示例来处

一时失言乱红尘/ 2024年09月15日 22:39/ 0 赞/ 100 阅读

相关 uniapp 给 editor 添加简单的工具栏

开发App时遇到富文本编辑，我首先的思路在uniapp官网找一下，确实官网给提供了内置组件editor。相信测试过案例时，都会发现没有工具栏。我也想如果有现成可以直接使用...

快来打我*/ 2024年04月22日 15:06/ 0 赞/ 74 阅读

相关 uniapp交互反馈api的使用示例

官方文档链接：[uni.showToast(OBJECT) | uni-app官网][uni.showToast_OBJECT_ _ uni-app] 1.un

Dear 丶/ 2024年02月05日 15:17/ 0 赞/ 37 阅读

相关 uniapp用户界面模板示例

<template> <view class="content"> <view class="userback"> <

￡神魔★判官ぃ/ 2023年02月16日 12:02/ 0 赞/ 4 阅读

相关 uniapp配合colorUI制作简单的信封

uniapp配合colorUI制作简单的信封没有审美，所以样式比较简陋，背景图可以换成自己想要的样子 ![在这里插入图片描述][20210127180403325.

ゝ一世哀愁。/ 2023年01月12日 01:59/ 0 赞/ 178 阅读

相关 uniapp 简单的登录页布局

效果： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmN

向右看齐/ 2023年01月03日 14:30/ 0 赞/ 379 阅读

相关 uniapp 简单的ToDoList

<template> <view class="content"> <view class="todo-header"> <!--

柔光的暖阳◎/ 2022年12月21日 02:23/ 0 赞/ 227 阅读

相关 uni-app引用mescroll-uni的简单示例

<template> <view> <mescroll-uni top="0" bottom="0" @down="downCallback" @

电玩女神/ 2022年11月20日 12:56/ 0 赞/ 421 阅读

相关 Random的简单引用

import java.util.Random; public class train3_1 { public static void main(St

偏执的太偏执、/ 2022年09月18日 02:52/ 0 赞/ 30 阅读