Object.freeze(),会阻止修改现有的property,意味着响应系统无法再追踪变化

代码示例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<p>{{ foo }}</p>
<button @click="foo = 'xxx'">change it</button> </div> </body>
<!-- 单独引入,不可在script间写逻辑代码 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script> <script>
var obj = {foo: 'bar111'}
// Object.freeze(),会阻止修改现有的property,意味着响应系统无法再追踪变化
Object.freeze(obj)
var vm = new Vue({
el: '#app',
data: obj
})
</script>
</html>

视图与控制台打印图示:

学习-Vue2-Vue实例-数据与方法-Object.freeze()的更多相关文章

  1. Vue2.x源码学习笔记-Vue实例的属性和方法整理

    还是先从浏览器直观的感受下实例属性和方法. 实例属性: 对应解释如下: vm._uid // 自增的id vm._isVue // 标示是vue对象,避免被observe vm._renderProx ...

  2. Vue学习之vue实例中的数据、事件和方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Generalizing from a Few Examples: A Survey on Few-Shot Learning 小样本学习最新综述 | 三大数据增强方法

    目录 原文链接:小样本学习与智能前沿 01 Transforming Samples from Dtrain 02 Transforming Samples from a Weakly Labeled ...

  4. 19 使用Vue实例的render方法渲染组件

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. vue实例属性的方法

    1.$mount()   手动设置挂载点  eg:vm.$mount("#app") 2.$destroy()  销毁   eg:vm.$destroy(); 3.$forceUp ...

  6. vue实例vm的方法

    import wbMessage from './wb-message' let Constructor = Vue.extend(wbMessage) let vm = new Constructo ...

  7. Vue(十二)vue实例的属性和方法

    vue实例的属性和方法 1. 属性 vm.$el vm.$data vm.$options vm.$refs <!DOCTYPE html> <html lang="en& ...

  8. vue第六单元(vue的实例和组件-vue实例的相关属性和方法-解释vue的原理-创建vue的组件)

    第六单元(vue的实例和组件-vue实例的相关属性和方法-解释vue的原理-创建vue的组件) #课程目标 掌握vue实例的相关属性和方法的含义和使用 了解vue的数据响应原理 熟悉创建组件,了解全局 ...

  9. vue 中使用 AJAX获取数据的方法

    在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...

  10. Vue框架(一)——Vue导读、Vue实例(挂载点el、数据data、过滤器filters)、Vue指令(文本指令v-text、事件指令v-on、属性指令v-bind、表单指令v-model)

    Vue导读 1.Vue框架 vue是可以独立完成前后端分离式web项目的js框架 三大主流框架之一:Angular.React.Vue vue:结合其他框架优点.轻量级.中文API.数据驱动.双向绑定 ...

随机推荐

  1. POJ1737 连通图

    一句话题意:求一个 \(n\) 点带编号的连通图数量. 吐槽一下:好好一道计数 dp 为什么不加取余????逼着选手写高精度的出题人应该拎出去烧--哦楼天城是出题人是吧哦当我没说我什么都没说我现在就把 ...

  2. dotnet总结

    初衷: 搞了几年.Net ,一直没在博客园做过系统的总结,并打算按照下面的结构来写 语言层面 类型系统 [查看]: https://www.cnblogs.com/francisXu/p/136027 ...

  3. Mybatis优化

    Mybatis优化 log4j日志显示 在pom.xml中的<dependencies>标签中加入 <!--log4j日志 --> <dependency> < ...

  4. 简述traceroute命令的原理

    原理 traceroute命令是一种用于显示数据包从源主机到目的主机经过的路由器和网络设备的路径的工具.traceroute命令的原理是利用IP数据报的生存时间(TTL)字段和因特网控制报文协议(IC ...

  5. Windows 远程桌面连接ip查询

    导航到:应用程序和服务日志 > Microsoft > Windows > TerminalServices- RemoteConnectionManager,右键单击"O ...

  6. 第八周作业-N67044-张铭扬

    1. 完成ftp的mysql虚拟用户 数据库服务器:10.0.0.152 FTP服务器:10.0.0.156 #配置数据库服务器 [root@centos8 ~]# yum -y install ma ...

  7. 把逗号分隔的String字符串转List<Integer>

    把逗号分隔的String字符串转int集合 集合或数组转变为逗号分隔的字符串的几种方式 1.自己编码实现 2.org.apache.commons.lang3.StringUtils 3.String ...

  8. C6657子卡模块设计资料:268-基于FMC接口的DSP TMS320C6657子卡模块

    基于FMC接口的DSP TMS320C6657子卡模块 一. 概述        FMC连接器是一种高速多pin的互连器件,广泛应用于板卡对接的设备中,特别是在xilinx公司的所有开发板中都使用.该 ...

  9. win7电脑休眠后只能按重启键解决办法

    一.点击"开始"后选择控制面板 二.选择"电源选项" 三.点击"更改计划设置" 四.选择"更改高级电源设置" 五.点击& ...

  10. 寒假acm训练第三周

    这个题就是简单的数学思维 如果这个数组里全部都是10的倍数那直接计数达到n就直接出0 如果有其它不是10的倍数那找出最小的直接减去就可以了 下面就是代码 #include<iostream> ...