首页 > 其他分享 >vue中的forceUpdate方法

vue中的forceUpdate方法

时间:2023-09-27 15:47:15浏览次数:34  
标签:index set list Vue sex vue 方法 forceUpdate

适用场景:
如果要改变data中的对象或者数组,会发现data数据改变了,但是页面上并没有更新
如:

this.list[index].sex = '男';

此时要想更新可以使用

this.$set(this.list[index],'sex','男')

也可以使用

this.list[index].sex = '男';
this.$forceUpdate(); //用来强制刷新页面

缺点:
forceUpdate可能会导致性能下降,因为它绕过了 Vue 的响应式系统

尽量使用Vue.set 和 this.$set ,可以在响应式对象中添加或更新属性,确保响应式系统能够跟踪属性变化。

标签:index,set,list,Vue,sex,vue,方法,forceUpdate
From: https://www.cnblogs.com/domin520Jian/p/17732855.html

相关文章

  • vue3项目结合ant design vue的upLoad组件实现上传和下载Excel文件
    1.上传文件  1.组件引入    import{ Button, Upload}from'ant-design-vue'  2.代码    <Upload      v-model:file-list="fileList"      name="file"      //限制文件格式      acce......
  • vue-router使用,localStorage系列,vue3介绍,组合式api和配置项api
    1vue-router使用......
  • vue 数组删除(对象)单/多条删除
    dataList:[{id:'1',value:'aaaa',},{id:'2',value:'bbb',},{id:'3',value:'ccc',},{......
  • 【转】Vue.js 中的父子组件通信方式
    Vue.js中的父子组件通信方式在Vue.js中,组件是构建应用程序的基本单元。当我们在应用程序中使用组件时,组件之间的通信是非常重要的。在Vue.js中,父子组件通信是最常见的组件通信方式之一。在本文中,我们将讨论Vue.js中的父子组件通信方式,并附上代码实例。 父组件向子组件传......
  • 使用ChatGPT快速构建优质网站模板的方法
    随着人工智能技术的不断发展,ChatGPT作为一种自然语言处理工具,正在被越来越多的领域所应用。其中,如何使用ChatGPT快速构建一个网站模板成为了许多开发者和企业关心的热点问题。本文将重点介绍如何使用ChatGPT快速构建一个网站模板,并突出其中的重点词汇或短语。确定网站目标和定位在......
  • 如何配置swgger以及使用方法(postman,apipost)
    一.如何配置swgger1.引入依赖:我配置的是swgger2,如果需要其他版本,可以自行百度<dependency><groupId>io.springfox</groupId><artifactId>springfox-swagger2</artifactId><version>2.4.0</version>......
  • opencv 图像处理方法汇总
      Qt的简单使用:https://www.cnblogs.com/carsonzhu/p/10815654.html一个案例:图像处理仿真平台https://blog.csdn.net/qq_37340229/article/details/128685044该系统主要针对医学超声图像进行处理,基本涵盖了医学图像处理的经典处理方法,有图像增强、图像滤波、边缘检测、......
  • 基于weka的数据库挖掘➖分类方法决策树分类
    基于weka的数据库挖掘➖分类方法决策树分类关于作者作者介绍......
  • 史诗级智能化!Win11 23H2今天正式推送:附升级方法
    Win1123H2今天正式推送,加入了Windows人工智能Copilot(智能副驾),强大的创作者工具可以让用户更轻松、快速地将想法变为现实。此外,新版还将带来更多功能,包括正在扩展语音访问功能,并为讲述人功能新增了新的自然语音,以保障在默认状态下Windows11的无障碍化体验。同时,微软正在通过采......
  • WinForm中UI假死的解决方法
    https://www.codenong.com/cs106719464/  WinForm中的UI假死其实是个老生常谈的问题了,但最近还是很多人问我该如何解决,所以今天就来说明一下如何解决UI假死的问题。实验程序界面如下图所示:方法一:async+await+Task首先看下面一段代码:123456789101112131415161718......