vue学习（九）对象变更检测注意事项
Vue不能检测对象属性的添加和删除，要是必须这么做的话
需要使用 vue.$set()
<body> <div id="app">
<h3>
{{user.name}} {{user.age}} <!--this.user.age=20 这个是不会成功的-->
</h3>
<button @click="handlerAdd">添加属性</button>
</div> <script>
// vue 不能检测对象属性的添加和删除
// 要用 vue的方法 Vue.set
let app = new Vue({
el:'#app',
data:{
user:''
},
methods:{
handlerAdd(){
// vue.$set(object,key,value)
this.$set(this.user,'age',20)
// this.user.age=20 这个是不会成功的
}
},
created(){
setTimeout(()=>{
this.user={
name:'张三'
}
},1250)
}
})
</script>
</body>
添加多个响应式属性
<h3>
{{user.name}}
{{user.phone}}
{{user.age}} <!--this.user.age=20 这个是不会成功的-->
</h3>
handlerAdd(){
// 添加多个响应式
this.user = Object.assign({},this.user,{
age:20,
phone:13811091109
})
}
vue学习（九）对象变更检测注意事项的更多相关文章
- Vue：对象更改检测注意事项
还是由于 JavaScript 的限制,Vue 不能检测对象属性的添加或删除: var vm = new Vue({ data: { a: 1 } }) // `vm.a` 现在是响应式的 vm.b ...
- vue 对象更改检测注意事项
- vue学习(九) 使用内联样式设置style样式
/html <div id="app"> //对象就是无序键值对的集合 <h1 :style="{ color:red, 'font-weight':2 ...
- vue学习(十一) v-for使用的注意事项：2.2.0+之后的版本里，当在组件中使用v-for时，key是必须的，它是用来表示唯一身份的
//html <div id="app"> <div> <label>id <input type="text" v- ...
- vue学习之组件
组件从注册方式分为全局组件和局部组件. 从功能类型又可以分为偏视图表现的(presentational)和偏逻辑的(动态生成dom),推荐在前者中使用模板,在后者中使用 JSX 或渲染函数动态生成组件 ...
- vue数组中对象属性变化页面不渲染问题
问题引入 Vue之所以能够监听Model状态的变化,是因为JavaScript语言本身提供了Proxy或者Object.observe()机制来监听对象状态的变化.但是,对于数组元素的赋值,却没有办法 ...
- vue中为对象添加值的问题
demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- vue学习笔记(九)vue-cli中的组件通信
前言 在上一篇博客vue学习笔记(八)组件校验&通信中,我们学会了vue中组件的校验和父组件向子组件传递信息以及子组件通知父组件(父子组件通信),上一篇博客也提到那是对组件内容的刚刚开始,而本 ...
- 深入学习JavaScript对象
JavaScript中,除了五种原始类型(即数字,字符串,布尔值,null,undefined)之外的都是对象了,所以,不把对象学明白怎么继续往下学习呢? 一.概述 对象是一种复合值,它将很多值(原始 ...
随机推荐
- ubuntu用命令行打开vscode
1.打开终端 2.输入code即可
- SpringBoot之Feign调用方式比较
一:事发原因 两个东家都使用SpringCloud,巴拉巴拉用上了Spring全家桶,从eureka到ribbon,从ribbon到feign,从feign到hystrix,然后在使用feign的时候 ...
- C#.NET解析XML（使用属性控制 XML 序列化）
使用属性可以控制对象的 XML 序列化. 默认情况下,XML 元素名称由类或成员名称确定.在名为 Book 的简单类中,字段 ISBN 将生成 XML 元素标记 <ISBN>,如下面的示例 ...
- Day10 - 灾难 HYSBZ - 2815
Description 阿米巴是小强的好朋友. 阿米巴和小强在草原上捉蚂蚱.小强突然想,果蚂蚱被他们捉灭绝了,那么吃蚂蚱的小鸟就会饿死,而捕食小鸟的猛禽也会跟着灭绝,从而引发一系列的生态灾难. 学过生 ...
- 如何书写高效的MySQL查询？
How to write efficient MySQL query statements WHERE子句中的书写注意事项 模糊查询(like)时需要注意的事项 索引 字段类型 表连接时的注意事项 其 ...
- IOS switch-case知多少
1. switch参数类型 switch参数类型要求是integer type,准确来讲,是可以转换成integer的类型, 这包括所有的C基本数据类型((signed/unsigned)char, ...
- 易升地址，windows 10, 1511 升级 1607 仍然有效
https://www.microsoft.com/zh-cn/software-download/windows10 易升地址, windows 10 ,1511 升级 1607 仍然有效
- 嵊州普及Day3T4
利内罗女士准备来到意大利进行修行.意大利由 n 个城市和 m 条道路构成,道路是双向的.到达第 i 个城市时,她可以取得该城市的全部信仰,并获得 ai 点能力提升,但因为在一个城市可以取得的信仰有 ...
- docker 日志清理
首先确认 docker 使用的存储引擎 docker info 如果使用 Logging Driver: json-file, 那么日志默认在 /var/lib/docker/contains/xxx ...
- LR的深入理解资料汇集
今天面试被问到LR的算法的梯度和正则化项,自己不太理解,所以找了一些相关资料,发现LR的算法在梯度下降,正则化和sigmoid函数方面都有很深的研究,期间也发现一些比较好的资料,记录一下. 这篇论文推 ...