不能给Vue实例、Vue实例的根数据对象添加属性。

文件

<template>
<div id="app">
<h2>{{hello}}:{{animal.name}}</h2>
</div>
</template> <script>
export default {
name: "app",
data: () => {
return {
hello: "你好",
animal: {}
};
},
mounted() {
setTimeout(() => {
this.$set(this.animal, "name", "大象

Vue动态添加响应式属性的更多相关文章

  1. Vue.set 向响应式对象中添加响应式属性,及设置数组元素触发视图更新

    一.为什么需要使用Vue.set? vue中不能检测到数组和对象的两种变化: 1.数组长度的变化 vm.arr.length = 4 2.数组通过索引值修改内容 vm.arr[1] = ‘aa’ Vu ...

  2. Vue数据绑定和响应式原理

    Vue数据绑定和响应式原理 当实例化一个Vue构造函数,会执行 Vue 的 init 方法,在 init 方法中主要执行三部分内容,一是初始化环境变量,而是处理 Vue 组件数据,三是解析挂载组件.以 ...

  3. vue 声明响应式属性

    声明响应式属性 由于vue不允许动态添加根级响应式属性,所以你必须在初始化实例前声明根级响应式属性,哪怕只是一个空值: var vm = new Vue({ data: { // 声明 message ...

  4. Vue 响应式属性

    本文参考自:https://www.w3cplus.com/vue/vue-reactivity-and-pitfalls.html 1.概述 当创建一个Vue实例时,每个数据属性.组件属性等都是可以 ...

  5. vue组件上动态添加和删除属性

    1.vue组件上动态添加和删除属性 // 添加 this.$set(this.obj, 'propName', val) // 删除 this.$delete(this.obj, 'propName' ...

  6. vue学习之响应式原理的demo实现

    Vue.js 核心: 1.响应式的数据绑定系统 2.组件系统. 访问器属性 访问器属性是对象中的一种特殊属性,它不能直接在对象中设置,而必须通过 defineProperty() 方法单独定义. va ...

  7. VUE 动态给对象增加属性,并触发视图更新。

    在开发过程中,我们时常会遇到这样一种情况:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的. 根据官方文档定义 ...

  8. 学习 vue 源码 -- 响应式原理

    概述 由于刚开始学习 vue 源码,而且水平有限,有理解或表述的不对的地方,还请不吝指教. vue 主要通过 Watcher.Dep 和 Observer 三个类来实现响应式视图.另外还有一个 sch ...

  9. Vue的数据响应式

    getter和setter怎么用 示例代码 getter ,关键词为 get ,用于获取一个值.定义时为函数,但是使用时不用加括号. setter 用于对数据的改写 Object.defineProp ...

随机推荐

  1. js Array 数组方法扩展

    //去重复   Array.prototype.unique = function()  {     this.sort();     var re=[this[0]];     for(var i ...

  2. express快速入门

    1.简介: express是基于Node.js平台,快速开放极简的web开发框架,使用 各种http使用工具和中间件,创建强大API. 2.安装 npm install express -g 全局安装 ...

  3. 第一个progressive web application,发车!

    progressive web application是谷歌推出的一种渐进式web应用,通过利用service-worker等来达到类似于原生应用,而且在chrome浏览器还可以添加到主页,完全就和一 ...

  4. mysql中explain输出列之id的用法详解

    参考mysql5.7 en manual,对列id的解释: The SELECT identifier. This is the sequential number of the SELECT wit ...

  5. 读取FTP上的excel文件,并写入数据库

    今天遇到一些问题,需要从ftp上读取一些excel文件,并需要将excel中的数据写入到数据库,这样就可以通过管理页面查看这些数据. 我将相关工作分为三步,1.从ftp上读取相关文件,并将excel文 ...

  6. 求助:关于shell数值比较的错误提示

    今天写了个脚本,过不了错误这一关,求大神路过瞟一眼. 1 #!/bin/bash 2 #disk use 3 disk_use() { 4 DISK_LOG=/tmp/disk_use.tmp 5 D ...

  7. Linux性能优化从入门到实战:03 CPU篇:CPU上下文切换

      linux操作系统是将CPU轮流分配给任务,分时执行的.而每次执行任务时,CPU需要知道CPU寄存器(CPU内置的内存)和程序计数器PC(CPU正在执行指令和下一条指令的位置)值,这些值是CPU执 ...

  8. hdu 4651 Partition(整数拆分+五边形数)

    Partition Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total ...

  9. spring requestbody json

    1  @requestbody string param 前台将jsonobject序列化成字符串 后台解析成JsonObject 2 @requestbody map<string,objec ...

  10. [题目] 4座塔的Hanoi

    题目地址 经典递推题. 解出 n (1<=n<=12) 个盘子 \(4\) 座塔的Hanoi(汉诺塔)问题最少需多少步?(1到12每个答案分别占一行) 题解 在原Hanoi问题中 \(d[ ...