当一个组件被定义，data 必须声明为返回一个初始数据对象的函数，因为组件可能被用来创建多个实例。 如果 data 仍然是一个纯粹的对象，则所有的实例将共享引用同一个数据对象！通过提供 data 函数， 每次创建一个新实例后，我们能够调用 data 函数，从而返回初始数据的一个全新副本数据对象。

重复创建实例造成多个实例共享一个数据对象如果改变某一个就会造成全部的改变类比于浅拷贝会造成数据污染

Vue2的组件中data为什么不能使用对象的更多相关文章

  1. 039——VUE中组件之子组件中data使用实例与text-xtemplate的使用方法

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

  2. vue组件中data为什么必须是个函数

    <body> <div id="app"> <counter></counter> </div> <templat ...

  3. Vue 组件中 data 为什么必须是函数

    原文地址 vue组件中的data必须是函数 类比引用数据类型 Object是引用数据类型,如果不用function 返回,每个组件的data 都是内存的同一个地址,一个数据改变了其他也改变了; jav ...

  4. 怎样理解 Vue 组件中 data 必须为函数 ?

    组件意在 复用 , 若为 对象, 则会相互干扰. 且 Vue 不允许此事发生, 规定必须为函数, 否则报错. 原理如下 对象 // 模拟创建组件 var Component= function() { ...

  5. Vue.js 组件中data的使用

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

  6. vue组件中data为什么必须是一个函数？

    因为JavaScript的特性所导致,在component中,data必须以函数的形式存在,不可以是对象. 组建中的data写成一个函数,数据以函数返回值的形式定义,这样每次复用组件的时候,都会返回一 ...

  7. 39.VUE学习--组件,子组件中data数据的使用,x-template模板的使用,改变for循环里的某条数据里的值

    多处引用相同组件时,操作data不会相互影响 <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  8. vue组件中data是个函数

    当我们const vm = new Vue({ el : '#app',   data : { msg:‘hello World’ } })用习惯了,data是一个对象,可到了vue组件 Vue.co ...

  9. 15.Vue组件中的data

    1.组件中展示数据和响应事件: // 1. 组件可以有自己的 data 数据 // 2. 组件的 data 和 实例的 data 有点不一样,实例中的 data 可以为一个对象 // 3. 但是组件中 ...

  10. 第六章 组件 56 组件-组件中的data

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

随机推荐

  1. maven本地仓库有相应的依赖，依旧会从远程仓库拉取问题的原因及解决

    请打开你自己的本地仓库,对应依赖路径下的_remote.repositories文件.如果是从远程仓库拉取的,这里一般是显示这个: junit-4.12.jar>alimaven= junit- ...

  2. postman打开白屏

    1.打开高级系统设置:2.在"高级"选项卡中,单击"环境变量":3.添加一个新的系统变量:POSTMAN_DISABLE_GPU=true4.关闭Postman ...

  3. 2020.11.14 typeScript声明空间

    在ts中存在两种声明空间: 类型声明空间和变量声明空间. 类型声明空间: 1. class People {} 2. interface People {} 3. type People = {} 变 ...

  4. scala apply方法和update方法

    示例代码1 class TestApplyClass { def apply(param: String): String = { println("apply method called, ...

  5. mitmproxy截取流量和抓包

    mitmproxy介绍https://blog.csdn.net/enemy_sprites/article/details/104052506 mitmproxy处理请求及乱码https://blo ...

  6. windows系统下使用java语言，在mysql数据库中做定时数据备份、删除

    有这样一个业务需求,需要将数据归档的表每月定时备份,并且删除之前表中的数据,话不多说,直接上代码! 注意:这种方法适合数据量小,业务要求不高的场景! 项目采用SpringBoot  + MyBatis ...

  7. 7. 基础增删改 - 创建管理员用Model-Drive App管理后台信息 - 在Model-Driven App中创建视图

    ​ 当我们创建完Model-Driven之后,就可以在里面创建我们所需要的视图,视图一般分为三类: 个人:根据自己的个人需求创建个人视图,只有创建者和其分享的人才能查看这些视图. 公共:可以根据团体需 ...

  8. [RoarCTF 2019]Easy Calc 1

    进入主页面是一个计算器,可以计算 右键源代码发现提示信息,javascript脚本,其中还有calc.php文件 注释说明了这里引入了waf 尝试访问calc.php 是一道命令执行,尝试输入phpi ...

  9. 车企-TSP系统通用架构设计

    最近一年用于参与到了新能源车企的管理系统的开发,并且主要从事架构设计与重难点功能开发的工作,因此有了一些小心得,特此记录(PS:整体和甲方在需求上扯皮,以及协调所有供应商这些项目管理上的事情比做开发耗 ...

  10. 【手搓模型】亲手实现 Vision Transformer

    前言 博客主页:睡晚不猿序程 首发时间:2023.3.17,首发于博客园 最近更新时间:2023.3.17 本文由 睡晚不猿序程 原创 作者是蒻蒟本蒟,如果文章里有任何错误或者表述不清,请 tt 我, ...