uniapp使用v-for页面不刷新解决办法

项目场景:

做一个项目,v-for循环数据库数据,使用uni-load-more,结果发现...

DOM中的列表却没有更新


解决方案:

根据网上教程,加了一个触底函数onReachBottom,结果发现无论如何也更新不了DOM中的数据,最后将触底函数改成手动click触发。
更改后的相关代码如下

// 视图层
<view v-if="refresh" v-for="data in dataList" :key="data.id">{{ data.名称 }}
</view>
<view @click="test"><uni-load-more :status="status" :content-text="contentText" v-if="dataList.length > 0" />
</view>// 脚本层
<script>export default {data() {return {status: 'more',contentText: {contentdown: '点击加载更多~',contentrefresh: '加载中',contentnomore: '我是有底线的~'},}},methods: {test(){if (this.status != 'noMore') {console.log("触底")this.status = 'loading';this.ifBottomRefresh = true// 再次调用接口this.getList()} else {this.status ="noMore"}}}}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/138418.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

人工智能基础——Python:Pillow与图像处理

人工智能的学习之路非常漫长&#xff0c;不少人因为学习路线不对或者学习内容不够专业而举步难行。不过别担心&#xff0c;我为大家整理了一份600多G的学习资源&#xff0c;基本上涵盖了人工智能学习的所有内容。点击下方链接,0元进群领取学习资源,让你的学习之路更加顺畅!记得…

uniapp 实现路线规划

UniApp是一个跨平台的应用开发框架&#xff0c;可以帮助开发者快速地在多个平台上构建应用程序。其中&#xff0c;实现路线规划是一个常见的需求&#xff0c;特别是对于地图类应用或者出行类应用来说&#xff0c;路线规划功能是非常重要的。 首先引入QQMapWX&#xff1b; impo…

经典算法(查找与排序)

查找 顺序查找 顺序查找&#xff08;Linear Search&#xff09;是一种在有序数组中查找目标元素的基本算法。它的时间复杂度为 O(n)&#xff0c;适用于查找少量数据。顺序查找的基本思想是从数组的第一个元素开始&#xff0c;逐个与待查找的元素进行比较&#xff0c;直到找到…

AMD64内存属性详解

本文参考文档为AMD64 Architecture Programmer’s Manual Volume 2: System Programming&#xff0c;版本号3.41&#xff0c;这不是对原英文文档的翻译&#xff0c;但是所有内容的排版都是根据原手册的排版来的&#xff0c;如有与官方文档冲突的内容&#xff0c;以官方文档为准…

Ubuntu 配置 Github 的 SSH keys

先进入已有的 Git 目录或使用新建的一个 Git 仓库下。 设置 Github 用户名和邮箱&#xff1a; $ git config --global user.name [Github用户名] $ git config --global user.email [Github认证邮箱]生成 SSH 密钥文件&#xff1a; $ ssh-keygen -t rsa -C [Github认证邮箱]…

Jmeter_逻辑控制器

逻辑控制器 控制取样器执行顺序的组件实现(分支 循环) 分类 1、如果(if) 控制器 分支实现 2、forEach控制器 循环往复实现 3、循环控制器 循环往复实现 如果(if) 控制器 需求1:测试计划中定义一个 http 请求访问百度&#xff0c;但是该请求不是无条件执行的&#xff0c;…

基于ssm的校园快递物流管理系统(java+jsp+ssm+javabean+mysql+tomcat)

博主24h在线&#xff0c;想要源码文档部署视频直接私聊&#xff0c;9.9拿走&#xff01; 基于javawebmysql的ssm校园快递物流管理系统(javajspssmjavabeanmysqltomcat) 运行环境&#xff1a; Java≥8、MySQL≥5.7、Tomcat≥8 开发工具&#xff1a; eclipse/idea/myeclipse/s…

2023年云计算发展趋势浅析

​​​​​​​ 云计算的概念 云计算是一种通过互联网提供计算资源和服务的模式。它允许用户通过网络访问和使用共享的计算资源&#xff0c;而无需拥有或管理这些资源的物理设备。云计算的核心理念是将计算能力、存储资源和应用程序提供给用户&#xff0c;以便随时随地根据需要…

【JS 高级之手写原理系列】学习笔记共 15 篇(完结)

这是我在 b 站上面学习的一门课程&#xff0c;个人学习笔记地址&#xff1a;https://github.com/kaimo313/javascript-advanced-handwriting-principles-series 01 # 手写 new 的原理02 # 手写 instanceof 的原理03 # 手写 call04 # 手写 apply05 # 手写 bind06 # 手写 map 方…

关于变电站综合自动化系统的案例应用分析-安科瑞 蒋静

摘 要&#xff1a;变电站综合自动化系统是将变电站内的二次设备经过功能的组合和优化设计&#xff0c;利用先进的计算机技术、通信技术、信号处理技术&#xff0c;实现对全变电站的主要设备和输、配电线路的自动监视、测量、控制、保护、并与上级调度通信的综合性自动化功能。 …

前端小技巧: TS实现EventBus自定义事件

关于EventBus事件总线 事件总线&#xff0c;实现 on, once, emit, off on, once 是注册函数&#xff0c;存储起来emit时找到对应的函数&#xff0c;执行off找到对应的函数&#xff0c;从对象中删除 注意 区分on和onceon绑定的事件可连续执行&#xff0c;除非offonce绑定的函数…

POD创建与删除简单描述

创建一个 Pod 的过程可以分为以下几个步骤&#xff1a; 用户使用 kubectl create 命令或 YAML 文件向 API 服务器发送创建 Pod 的请求。API 服务器将请求转换为 Kubernetes 的内部对象&#xff0c;并将 Pod 的状态设置为 Pending。调度器根据 Pod 的资源需求和节点的资源情况&…

linux 内存查看方法:meminfo\maps\smaps\status 文件解析

linux 下面查看内存有多种渠道&#xff0c;比如通过命令 ps ,top,free 等&#xff0c;比如通过/proc系统&#xff0c;一般需要比较详细和精确地知道整机内存/某个进程内存的使用情况&#xff0c;最好通过/proc 系统&#xff0c;下面介绍/proc系统下内存相关的几个文件 单个进程…

4.4.2 结构可以将 string类作为成员吗

// structure template { }; 4.4.2 结构可以将 string类作为成员吗 可以将成员name指定为string类对象而不是字符数组吗?即可以像下面这样声明结构吗? #include <string> struct inflatable std :: string name; float volume; double price; 大体上说,答案是肯定的。实…

go语言 | 图解反射(一)

反射 反射是指在程序运行期对程序本身进行访问和修改的能力 变量的内在机制 变量包含类型信息和值信息 var arr [10]int arr[0] 10 类型信息&#xff1a;是静态的元信息&#xff0c;是预先定义好的 值信息&#xff1a;是程序运行过程中动态改变的 反射的使用 reflect包封…

在opencv OpenCV中打开相机摄像头,用分水岭算法实时实现图像的分割与提取

import cv2 import numpy as np# 定义回调函数 def callback(x):pass# 打开摄像头 cap cv2.VideoCapture(0)# 创建窗口和控件 cv2.namedWindow(image) cv2.createTrackbar(threshold, image, 0, 255, callback)# 初始化参数 bgdModel np.zeros((1, 65), np.float64) fgdModel…

C语言动态规划解决0-1背包问题

动态规划&#xff08;Dynamic Programming&#xff0c;简称DP&#xff09;是一种在数学、计算机科学和经济学中使用的&#xff0c;通过把原问题分解为相对简单的子问题的方式求解复杂问题的方法。动态规划常常适用于有重叠子问题和最优子结构性质的问题&#xff0c;它能够将问题…

搭建神经网络(torch.nn的用法)

零零碎碎总结了一些torch框架里面nn模块的用法&#xff0c;尤其是关于搭建神经网络的 nn.ModuleList nn.Module nn.Sequential nn.Linear nn.Dropout nn.Embedding nn.DataParallel() 将模型封装起来&#xff0c;便于在多个gpu上并行计算&#xff0c;训练或者推理 nn.…

MyBatis-Plus--在xml中使用wrapper的方法

原文网址&#xff1a;MyBatis-Plus--在xml中使用wrapper的方法_IT利刃出鞘的博客-CSDN博客 简介 本文介绍MyBatis-Plus如何在xml中使用wrapper。 Service QueryWrapper<T> wrapper new QueryWrapper<T>(); wrapper.eq("r.room_id", vo.getRoomId())…

量子计算和量子通信技术:引领潜力无限的未来

近年来&#xff0c;随着量子计算和量子通信技术的迅速发展&#xff0c;它们在各个领域的广泛应用前景引起了人们的极大兴趣。本文将深入探讨量子计算和量子通信技术的普遍应用&#xff0c;以及它们预示的未来&#xff0c;同时提出业内人士需要注意的事项。 介绍&#xff1a;量子…