当前位置:   article > 正文

【uniapp踩坑记】使用z-paging组件,微信小程序端加载不出来问题解决_z-paging默认不执行请求

z-paging默认不执行请求

使用z-paging组件,h5端加载正常,微信小程序端显示空白

今天做分页列表,在插件市场找到了z-paging,照着示例代码写了进去,在h5端能正常使用,在小程序端一直显示空白

尝试过以下无效操作:
1.清除所有文件缓存,不停重新编译,没用
2.修改小程序版本库,没用
3.组合式api改为选项式api,没用
代码如下:

//vue
<template>
<z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
		<view class="item" v-for="(item,index) in dataList" :key="index">
			<view class="platform_name">{{item.title}}</view>
		</view>
	</z-paging>
</template>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
//javascript
<script setup lang="ts">
	import { ref } from 'vue';
	// 必须导入需要用到的页面生命周期(即使在当前页面上没有直接使用到)
	import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
	import useZPaging from "@/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js";
	
    const paging = ref(null)
	
    let dataList = ref([])
	
	// 类似mixins,如果是页面滚动务必要写这一行,并传入当前ref绑定的paging,注意此处是paging,而非paging.value
	useZPaging(paging)
	function queryList(pageNo, pageSize){
		//这里应该调用api接口,调试阶段直接赋值
		paging.value.complete([{title:'111'},{title:'222'}]);
	}
</script>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18

最终解决方案——关闭整个HBuilder,项目重新运行。。。。。。。
整个项目重启后就正常了,真的吐血,浪费了3个小时一直以为自己代码有问题。。

后面发现JavaScript代码中,以下代码可以移除,这几行移除不影响正常使用
后记:这几行如果使用页面滚动必须加上,不然无法正常上滑

import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
import useZPaging from "@/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js";

useZPaging(paging)
  • 1
  • 2
  • 3
  • 4
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家自动化/article/detail/466728
推荐阅读
相关标签
  

闽ICP备14008679号