当一个组件被定义，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. input类型为number仍可以输入e,+,-解决方法

    <input type="number" onKeypress="return(/[\d\.]/.test(String.fromCharCode(event.ke ...

  2. K8S二进制单节点部署

    一.常见的k8s部署方式 1.inikube: Minikube是一个工具,可以在本地快速运行一个单节点微型K8s,仅用于学习预览K8s的一些特性使用 部署地址: https://kubernetes ...

  3. Sqoop导入MySQL表中数据到Hive出现错误： ERROR hive.HiveConfig: Make sure HIVE_CONF_DIR is set correctly.ERROR tool.ImportTool: Import failed:

    1.问题描述: (1)问题示例: [Hadoop@master TestDir]$ sqoop import --connect jdbc:mysql://master:3306/source?use ...

  4. class3

    #include<stdio.h> #include<stdlib.h> #include<time.h> #include<windows.h> #d ...

  5. Python第十章实验报告

    一.实验对象:<零基础学Python>6道实例和2道实战 二.实验环境:IDLE Shell 3.9.7 三.实验目的:学习如何在Python中进行文件和目录的相关操作 四.实验过程: 实 ...

  6. maven插件汇总

    编译Java源码,一般只需设置编译的jdk版本 <plugin> <groupId>org.apache.maven.plugins</groupId> <a ...

  7. pytest用例管理框架实战（基础篇）

    先安装pip install pytest pytest用例管理框架 默认规则: 1.py文件必须以test_开头或者_test结尾 2.类名必须以test开头 3.测试用例必须以test_开头 ge ...

  8. DVWA-File Inclusion(文件包含)

    文件包含漏洞,当我们在一个代码文件想要引入.嵌套另一个代码文件的时候,就是文件包含. 常见的文件包含函数有include require等函数. 这两个函数的区别就是include在包含文件不存在时p ...

  9. python-if、while、for语句的练习

    简单练习 1. 根据百分制成绩打印及格和不及格,60分一下不及格 source = float(input('请输入您的成绩:')) if 0 <= source < 60: print( ...

  10. CentOS /RHEL 系统更新安全补丁的方法

    在 Linux 系统上,其中一个最重要的需求就是保持定期更新最新的安全补丁,或者为相应的 Linux 版本更新可用的安全补丁.在这篇文章中,我们将分享如何在 CentOS/RHEL 7/6 版本中设置 ...