首页 > 其他分享 >2023-07-12 vue this.$set设置子组件内的值无效(uniapp+vue)

2023-07-12 vue this.$set设置子组件内的值无效(uniapp+vue)

时间:2023-07-12 10:57:17浏览次数:40  
标签:uniapp arr vue set dataSource 组件

前言:怎么说呢,子组件内嵌套了多层对象和数组,业务逻辑也是在子组件内处理,如何修改多层嵌套的对象数组的值?

vue提供了一个this.$set方法去改变对应的值,实测在uniapp打包的微信小程序中无法使用该方法,而在Android端则可以,那有没有两全其美的方法?

答案是有,在修改深层次的值时可以通过先保存原值(this.dataSource)给一个变量(arr),然后清除原值(this.dataSource = [];),接着用这个arr去操作数据,最后再把arr赋值给this.dataSource,即:

let arr = [];
arr = this.dataSource;
this.dataSource = [];
// 此处进行业务操作
// ....
this.dataSource = arr;

如果直接去用this.dataSource进行业务操作,那么结果和this.$set是一样的,视图并不会更新。

标签:uniapp,arr,vue,set,dataSource,组件
From: https://www.cnblogs.com/iuniko/p/17546941.html

相关文章

  • mybatis-plus Error attempting to get column 'xxx' from result set.
     报错信息:mybatis-plusErrorattemptingtogetcolumn'xxx'fromresultset. 解决:1、获取数据的实体类中新建了一个有参的构造方法,却没有无参构造方法,使用MyBatis-Plus内置方法进行查询时会报错。解决办法:新建一个无参构造方法。......
  • C++面试八股文:知道std::unordered_set/std::unordered_map吗?
    C++面试八股文:知道std::unordered_set/std::unordered_map吗?某日二师兄参加XXX科技公司的C++工程师开发岗位第27面:面试官:知道std::unordered_set/std::unordered_map吗?二师兄:知道。两者都是C++11引入的新容器,和std::set和std::map功能类似,key唯一,unordered_map的value可变。......
  • 谷歌浏览器Charset扩展程序(解决Google浏览器没有编码的问题)
    较新的谷歌浏览器没有编码这一项,可以选择添加插件的方式,如果无法访问chrome应用商店,请看本文最后的链接下载。将下载好的扩展程序解压,并添加该文件夹。就能看到Charset了。 可以设置了。 下载链接:链接:https://pan.baidu.com/s/1qy53aI6AgCuXUEB0fAb4aQ提取......
  • AT_agc062_c [AGC062C] Mex of Subset Sum 思维妙妙题--zhengjun
    思路比较巧妙。首先排序。考虑目前维护出\(a_{1\simi}\)不能表示的数的集合\(S\)。考虑如何加入\(a_{i+1}\)。如果当前\(<a_i\)的数足够了,直接输出(因为这些数将会一直留在\(S\)中)。记\(sum=\sum\limits_{j=1}^{i}a_j\)。\(a_{i+1}>sum\)\[S'=S\cup[sum+1,a_{i+......
  • vue学习——vue实例与组件
     vc不是通用的称呼,官方的说法是组件实例对象 组件实例的原型对象的原型对象是vue的原型对象 ......
  • 18:vue3 异步加载
    在大型项目中,我们可能需要拆分应用为更小的块,并仅在需要时再从服务器加载相关组件。Vue提供了 defineAsyncComponent 方法来实现此功能: 1<template>2<h3>异步加载</h3>3<KeepAlive>4<component:is="tabComponent"></component>5</KeepAlive>......
  • vue2基础 入门vue2
    vue基础vue项目搭建vue单文件组件mustach表达式vue指令methods方法filters过滤器computed计算属性watch监听器vue组件vue-router路由vue生命周期vue组件通信slot插槽vuex状态管理前言vuejs是一个构建数据驱动的渐进式MVVM框架......
  • vue自学总结
    一、先安装node.js,安装之后需配制环境变量,否则运行npm命令时会导致该命令不存在的情况查看版本:node-v二、安装vuenpminstall-gvue-cli安装vue2脚手架npminstall-g@vue/cli安装vue3脚手架npmuninstall-gvue-cli卸载vue2脚手架npmuninstall-g@vue/cli卸载vue......
  • 16:vue3 动态组件
    A组件1<template>2<h3>ComponentA</h3>3</template>B组件1<template>2<h3>ComponentB</h3>3</template> App.vue1<template>2<h3>动态组件(A、B两个组件动态切换)</h3>3<compo......
  • 基于python的租房网站-房屋出租租赁系统(python+django+vue)
    该项目是基于python/django/vue开发的房屋租赁系统/租房平台,作为本学期的课程作业作品。欢迎大家提出宝贵建议。功能介绍平台采用B/S结构,后端采用主流的Python+Django进行开发,前端采用主流的Vue.js进行开发。整个平台包括前台和后台两个部分。前台功能包括:首页、房屋详情页、......