this.$set用法
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用法的更多相关文章
- EditText 基本用法
title: EditText 基本用法 tags: EditText,编辑框,输入框 --- EditText介绍: EditText 在开发中也是经常用到的控件,也是一个比较必要的组件,可以说它是 ...
- jquery插件的用法之cookie 插件
一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...
- Java中的Socket的用法
Java中的Socket的用法 Java中的Socket分为普通的Socket和NioSocket. 普通Socket的用法 Java中的 ...
- [转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法
一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...
- python enumerate 用法
A new built-in function, enumerate() , will make certain loops a bit clearer. enumerate(thing) , whe ...
- [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...
- 【JavaScript】innerHTML、innerText和outerHTML的用法区别
用法: <div id="test"> <span style="color:red">test1</span> tes ...
- chattr用法
[root@localhost tmp]# umask 0022 一.chattr用法 1.创建空文件attrtest,然后删除,提示无法删除,因为有隐藏文件 [root@localhost tmp] ...
- 萌新笔记——vim命令“=”、“d”、“y”的用法(结合光标移动命令,一些场合会非常方便)
vim有许多命令,网上搜有一堆贴子.文章列举出各种功能的命令. 对于"="."d"."y",我在无意中发现了它们所具有的相同的一些用法,先举 ...
- [转]thinkphp 模板显示display和assign的用法
thinkphp 模板显示display和assign的用法 $this->assign('name',$value); //在 Action 类里面使用 assign 方法对模板变量赋值,无论 ...
随机推荐
- 压测中的QPS与TPS区别
原文来自:https://www.cnblogs.com/fkkk/p/11957566.html QPS(每秒查询率)=并发数/平均响应时间 TPS(每秒处理事务数)=请求数/时间(秒) TPS的过 ...
- MyBatis 批量插入数据的 3 种方法!
批量插入功能是我们日常工作中比较常见的业务功能之一,之前我也写过一篇关于<MyBatis Plus 批量数据插入功能,yyds!>的文章,但评论区的反馈不是很好,主要有两个问题:第一,对 ...
- C++核心编程 4 类和对象-对象的初始化和清理
构造函数和析构函数 对象的初始化和清理工作是两个非常重要的安全问题,一个对象或者变量没有初始状态,对其使用结果是未知的,同样,使用完一个对象或变量,没有及时清理,也会造成一定的安全问题.C++利用了构 ...
- 详解package-lock.json的作用
目录 详解package-lock.json package-lock.json的作用 版本号的定义规则与前缀对安装的影响 改动package.json后依旧能改变项目依赖的版本 当前项目的真实版本号 ...
- 调试器地址出现大小端紊乱,引发的异常: 0xC0000005: 读取位置 0xFFFFFFFFFFFFFFFF 时发生访问冲突。
今天在编写一系列新增需求代码后,开始调试代码 发现上个版本正常可运行的代码出现了:引发的异常: 0xC0000005: 读取位置 0xFFFFFFFFFFFFFFFF 时发生访问冲突. 上个版本数代码 ...
- 运行WampServer提示计算机中丢失 msvcr110.dll
在第一次运行WampServer的时候,出现"无法启动此程序,因为计算机中丢失 MSVCR110.dll.尝试重新安装该程序以解决此问题. 在浏览器的地址栏里输入 http://ww ...
- (翻译)领域驱动设计实现-Implementing Domain Driven Design
简介 Implementing Domain Driven Design 领域驱动设计实现 A practical guide for implementing the Domain Driven D ...
- 学习笔记-React的简单介绍&工作原理
一.React简单介绍 1.React起源于Facebook内部项目,与2013年5月 2.是一个用于构建用户界面的JavaScript库 二.React特点 1.声明式设计-React采用声明范式, ...
- 新產品SWOT分析實例
推出新产品需要解决四个行销支柱: 价格 产品 促销 销售地点 要分析这些方面,请检查您的优势.劣势.机会和威胁,以帮助您在运行第一个广告或举行第一次促销之前将风险降至最低,并最大限度地利用资源.SWO ...
- UML图 | 时序图(顺序、序列图)绘制
上一次写过一篇 UML | 类图 相关的文章,平时规范开发会用的上,或者是写什么文档,就还是需要画图,就像毕业设计就是如此.希望能够帮助到大家. 注:本文中所用画图软件为 Microsoft Visi ...