this.$set()的主要功能是解决改变数据时未驱动视图的改变的问题,也就是实际数据被改变了,但我们看到的页面并没有变化,这里主要讲this.$set()的用法,如果你遇到类似问题可以尝试下,vue官网写的是Vue.set,和this.$set()是一样的,但要注意当前this的指向问题,你要记住时this.$set()时当前this的指向一定要是最外层。

vue和uniapp语法大部分都是相同的,uniapp是针对移动端的,并且可以开发小程序,最重要的区别是uniapp开发小程序时不能操作dom,注意,是不能,不是不建议,操作DOM后编译代码时会报错。

先写下数据

items: [
{ message: "one", id: "1" },
{ message: "two", id: "2" },
{ message: "three", id: "3" }
]

通常我们改变某个message会这么写

this.items[0].message='one1'; //这么写一般是可以更新视图的 我只是给举this.$set()用法的例子

使用this.$set()时

this.$set(this.items[0],'message','one1');//改成数字类型就不用了加引号

有的时候我们可能一次改多个

this.items[0]={ message: "one3", id: "13" };

使用this.$set()时, 格式this.$set( target, key, value )

this.$set( this.items, 0, { message: "one3", id: "13" })

给大家复现一种不渲染的例子:当前我们数组内有三条对象,那么我想加一条,并且我就不用类似push的东西,还要能渲染到视图

普通写法 不渲染

this.items[3]={ message: "four", id: "4" };//数据已经被改变  但是视图层没渲染,我们看不到

使用this.$set()时, 格式this.$set( target, key, value )

this.$set( this.items, 3, { message: "four", id: "4" })//这样就可以渲染到视图层了

this.$set用法的更多相关文章

  1. EditText 基本用法

    title: EditText 基本用法 tags: EditText,编辑框,输入框 --- EditText介绍: EditText 在开发中也是经常用到的控件,也是一个比较必要的组件,可以说它是 ...

  2. jquery插件的用法之cookie 插件

    一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...

  3. Java中的Socket的用法

                                   Java中的Socket的用法 Java中的Socket分为普通的Socket和NioSocket. 普通Socket的用法 Java中的 ...

  4. [转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法

    一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...

  5. python enumerate 用法

    A new built-in function, enumerate() , will make certain loops a bit clearer. enumerate(thing) , whe ...

  6. [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

    本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...

  7. 【JavaScript】innerHTML、innerText和outerHTML的用法区别

    用法: <div id="test">   <span style="color:red">test1</span> tes ...

  8. chattr用法

    [root@localhost tmp]# umask 0022 一.chattr用法 1.创建空文件attrtest,然后删除,提示无法删除,因为有隐藏文件 [root@localhost tmp] ...

  9. 萌新笔记——vim命令“=”、“d”、“y”的用法(结合光标移动命令,一些场合会非常方便)

    vim有许多命令,网上搜有一堆贴子.文章列举出各种功能的命令. 对于"="."d"."y",我在无意中发现了它们所具有的相同的一些用法,先举 ...

  10. [转]thinkphp 模板显示display和assign的用法

    thinkphp 模板显示display和assign的用法 $this->assign('name',$value); //在 Action 类里面使用 assign 方法对模板变量赋值,无论 ...

随机推荐

  1. html网页乱码

    html乱码原因与网页乱码解决方法   html乱码原因与网页乱码解决方法,浏览器浏览网页内容出现乱码符合解决篇(html中文乱码) 造成html网页乱码原因主要是html源代码内中文字内容与html ...

  2. 鸿蒙内核源码分析(线程概念篇) | 是谁在不停的折腾CPU? | 百篇博客分析OpenHarmony源码 | v21.06

    百篇博客系列篇.本篇为: v21.xx 鸿蒙内核源码分析(线程概念篇) | 是谁在不断的折腾CPU | 51.c.h .o 任务管理相关篇为: v03.xx 鸿蒙内核源码分析(时钟任务篇) | 触发调 ...

  3. 一个故事看懂CPU的TLB

    Hi,我是CPU一号车间的阿Q,还记得我吗,真是好久不见了- 我所在的CPU是一个八核CPU,就有八个工作车间,那运行起来速度杠杆的- 虚拟地址翻译 一大早,我们一号车间MMU(内存管理单元)部门的小 ...

  4. JuiceFS v0.17 发布,通过 1270 项 LTP 测试!

    小伙伴们大家好,JuiceFS v0.17 在国庆小长假来临之际如期发布了!这是我们在 2021 年秋季推出的第二个版本,让我们直奔主题,看看都有哪些新变化吧. 本次更新累计 80+ 提交,共有 9 ...

  5. oracle dg failover灾难切换

    oracle dg failover灾难切换SQL> alter database recover managed standby database finish force;SQL> a ...

  6. oracle 不能用上下键调用sql语句

    在Linux的sqlplus中运行SQL语句之后,想用上下键把历史命令找出来,发现不支持. 安装rlwrap 重启sqlplus 3,使用rlwrap,rlwrap sqlplus / as sysd ...

  7. 给力!斩获 GitHub 14000 Star,两周创办开源公司获数百万美元融资

    文章来源|AI科技大本营 作者|伍杏玲 上世纪 90 年代初,21 岁大学生 Linus Torvalds 开源 Linux 操作系统,自此掀起全球开源浪潮.随后"中国 Linux 第一人& ...

  8. css3新增属性-background背景

    css3新增属性 边框属性 背景属性 文字属性 颜色属性 背景属性 属性 说明 background-image 添加背景图片 background-size 指定背景图像的大小 background ...

  9. 洛谷1429 平面最近点对(KDTree)

    qwq(明明可以直接分治过掉的) 但是还是当作联系了 首先,对于这种点的题,很显然的套路,我们要维护一个子树\(mx[i],mn[i]\)分别表示每个维度的最大值和最小值 (这里有一个要注意的东西!就 ...

  10. Java(47)反射

    作者:季沐测试笔记 原文地址:https://www.cnblogs.com/testero/p/15201675.html 博客主页:https://www.cnblogs.com/testero ...