vue data为什么是函数
vue data是函数的原因:
1、防止data复用;
2、data独立性;
3、作用域;
4、js的特性。
总结来说,如果data是一个函数的话,这样每复用一次组件,就会返回一份新的data(类似于给每个组件实例创建一个私有的数据空间,让各个组件实例维护各自的数据)。
1、防止data复用
vue中组件是用来复用的,为了防止data复用,将其定义为函数。
2、data独立性
vue组件中的data数据都应该是相互隔离,互不影响的,组件每复用一次,data数据就应该被复制一次,之后,当某一处复用的地方组件内data数据被改变时,其他复用地方组件的data数据不受影响,就需要通过data函数返回一个对象作为组件的状态。
3、作用域
当我们将组件中的data写成一个函数,数据以函数返回值形式定义,这样每复用一次组件,就会返回一份新的data,拥有自己的作用域,类似于给每个组件实例创建一个私有的数据空间,让各个组件实例维护各自的数据。
4、js的特性
当我们组件的date单纯的写成对象形式,这些实例用的是同一个构造函数,由于JavaScript的特性所导致,所有的组件实例共用了一个data,就会造成一个变了全都会变的结果。
vue data为什么是函数的更多相关文章
- Vue 组件 data为什么是函数?
在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...
- Vue 组件 data为什么是函数
在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...
- 深入理解--VUE组件中数据的存放以及为什么组件中的data必需是函数
1.组件中数据的存放 ***(重点)组件是一个单独模块的封装:这个模块有自己的HTML模板,也有data属性. 只是这个data属性必需是一个函数,而这个函数返回一个对象,这个对象里面存放着组件的数据 ...
- vue data不可以使用箭头函数的问题解析
这篇文章主要介绍了vue data不可以使用箭头函数问题,本文通过源码解析给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下 首先需要明确,a() {}和 b: () => {} ...
- 黑马vue---61、为什么vue组件的data要是一个函数
黑马vue---61.为什么vue组件的data要是一个函数 一.总结 一句话总结: 因为js中以函数为变量作用域,所以这样可以保证每个组件的数据不互相影响 二.why components data ...
- vue组件中的data为什么是函数?
一.vue组件中的data为什么是函数 为了保证组件的独立性 和 可 复用性,data 是一个函数,组件实例化的时候这个函数将会被调用,返回一个对象,计算机会给这个对象分配一个内存地址,你实例化几次, ...
- Vue组件中的Data为什么是函数。
简单点说,组件是要复用的,在很多地方都会调用. 如果data不是函数,而是属性,就又可能会发生多个地方的相同组件操作同一个Data属性,导致数据混乱. 而如果是函数,因为组件data函数的返回值是 ...
- Vue生命周期 钩子函数和组件传值
Vue生命周期 钩子函数 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等. 同时在这个过程中也会运行一 ...
- $.getJSON('url',function(data){}) 中回调函数不执行
$.getJSON('url',function(data){}) 中回调函数不执行 url 中的 json 格式不正确 ,浏览器返回并没有报错 {'湖北':[114.11438,30.849429] ...
- vue & $data & data
vue & $data & data vm.a === vm.$data.a https://vuejs.org/v2/api/#data https://flaviocopes.co ...
随机推荐
- 【JVM调优】Day02:CMS的三色标记算法、分区的G1回收器、短时停顿的ZGC回收器
一.CMS及其三色标记算法 1.核心 标记整个图谱的过程分为多步 多个线程相互工作,才能标记完 标记的算法,JVM虚拟机.go语言使用的都是三色标记算法 2.含义 从那个地方开始,用三种颜色替代 一开 ...
- python 之用户自定义函数
什么是函数? 函数无非就是将代码块进行封装,想用的时候拿来用,减少代码量,提高效率. 函数的定义 定义一个函数需要: 1.def关键字,def 后面空一格输入函数名称,函数命名时尽量简短,且具有意义, ...
- Apache Dubbo 官方正式发布 Spring 6 & Spring Boot 3 支持
Dubbo 简介 Apache Dubbo 是一款 RPC 服务开发框架,用于解决微服务架构下的服务治理与通信问题,官方提供了 Java.Golang 等多语言 SDK 实现.使用 Dubbo 开发的 ...
- 一个简单的rust字符串时钟
1.简介 用rust写的一个简单的练手的demo,一个字符串时钟,在终端用字符串方式显示当前时间.本质是对图片取灰度,然后每个像素按灰度门限用星号代替灰度值,就把图片变为由星号组成的字符型图案.把 ...
- [OpenCV实战]17 基于卷积神经网络的OpenCV图像着色
目录 1 彩色图像着色 1.1 定义着色问题 1.2 CNN彩色化结构 1.3 从 中恢复彩色图像 1.4 具有颜色再平衡的多项式损失函数 1.5 着色结果 2 OpenCV中实现着色 2.1 模型下 ...
- cookie、session,、token,还在傻傻分不清?
摘要:session 和 token 本质上是没有区别的,都是对用户身份的认证机制,只是他们实现的校验机制不一样而已. 本文分享自华为云社区<Session/Cookie/Token 还傻傻分不 ...
- vulnhub靶场之FUNBOX: UNDER CONSTRUCTION!
准备: 攻击机:虚拟机kali.本机win10. 靶机:Funbox: Under Construction!,下载地址:https://download.vulnhub.com/funbox/Fun ...
- 算法之Floyd-Warshall算法【c++】【图论】【最短路】
我们作为刚学图论的小蒟蒻,先接触到的算法一定是图上最短路径算法.而最短路算法中最简单的当属Floyd-Warshall算法.下面是一些基本介绍: 该算法可以计算图上任意两点间的最短路径 时间复杂度: ...
- forEach(遍历) VS map(映射) VS reduce(聚合)---学习笔记
- chrome实现下载文件JS代码弹出'另存为'窗口
1.TXT类型文件 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...