Data为什么是一个函数

最新推荐文章于 2024-04-18 14:24:17 发布
最新推荐文章于 2024-04-18 14:24:17 发布
阅读量92 收藏
点赞数
文章标签： javascript 前端 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/BLUE825/article/details/126510843
版权

实例定义的data既可以是函数也可以是一个对象，

组件定义的话必须是一个函数，

我们定义一个组件的时候，vue最终会通过Vue.extend()构成组件实例。比如说

采用对象形式：                                                                                                                               创建两个组件实例，修改A组件的data属性的值，B也会发生改变                                                     原因是两者共用了一个内存地址，所以修改了A，B同样产生了影响

采用函数形式：                                                                                                                                  用函数形式就不会出现这种情况，修改A属性的值，B的值不受影响                                               因为vue他是有很多个实例，采用函数返回一个全新的data形式，使每个实例对象的数据都不会受到其他实例对象的污染 

blue.CC
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue中data为什么是一个函数
fqr101的博客
10-24 461
vue 中的组件是用来复用的，为了防止 data 被复用，所以将其定义成一个函数 vue 组件中的 data 数据都应该是相互隔离，互不影响的，组件每复用一次，data 数据就应该被复制一次，之后，当某一处复用的地方组件内 data 数据被改变时，其他复用地方组件的 data 数据不受影响，就需要通过 data 函数返回一个对象作为组件的状态。 当我们将组件中的 data 写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的 data，拥有自己的作用域，类似于给每个组件实例创建一
解析vue data不可以使用箭头函数问题
12-11
首先需要明确，a() {}和 b: () => {}是不同的 let obj = { a() {}, // 相当于 a:function() {}, b: () => {} } 1 VUE.js 源码解析 注意此处只设计核心代码 这段代码也是UMD实现原理，本文这里不是重点，有兴趣...
为何组件的data必须是一个函数
weixin_53944118的博客
04-07 1364
一、实例和组件定义data的区别 vue实例中的data属性既可以是一个对象，也可以是一个函数 const app = new Vue({ el:"#app", // 对象格式 data:{ foo:"foo" }, // 函数格式 data(){ return { foo:"foo" } } 组件中定义data属性， 只能是一个函数 如果为组件data直接定义为一个对象 Vu
vue中，为什么data属性是一个函数，而不是一个对象？
最新发布
pig_ning的博客
04-18 476
vue中，为什么data属性是一个函数，而不是一个对象？
data为什么是一个函数
weixin_49757430的博客
04-29 480
组件中data为什么是一个函数？ vue实例中的data属性既可以是一个对象，也可以是一个函数 const app = new Vue({ el: "#app", data: { foo: "foo" }, data() { return {
data 为什么是一个函数
NXZ13419918873的博客
12-24 624
在前端开发中，特别是在使用Vue.js框架时，"data" 通常是一个函数，而不是一个变量。这是因为在Vue组件中，"data" 是一个函数，用于返回包含组件状态的对象。
Vue组件为什么data必须是一个函数
11-20
首先我们达成一个共识（没有这个共识，请补充下 js 原型链部分的知识）： 实例它们构造函数内的this内容是不一样的。 Component.prototype ，这类底下的方法或者值，都是所有实例公用的。 解开疑问 基于此，我们...
详解Vue的组件中data选项为什么必须是函数
01-19
只有一个例外：data 必须是函数。实际上，如果你这么做： Vue.component('my-component', { template: '<span>{{ message }}</span>', data: { message: 'hello' } }) 那么 Vue 会停止运行，并在控制台发出警告...
为什么data是一个函数
jia632133535的博客
12-27 486
为什么data是一个函数 1.根实例对象data可以是对象也可以是函数（根实例是单例），不会产生数据污染情况。 如果是一个对象的话，每个组件实例的data都是同一个引用数据，当该组件作为公共组件共享使用，一个地方的data更改，所有的data一起改变，如果data是一个函数，每个实例的data都在闭包中，就不会各自影响了。 ...
为什么data必须是一个函数
weixin_50736511的博客
03-24 479
如果data是一个函数的话，那么我们每次创建一个新的实例之后，就会调用一个新的data函数。也就是给每一个data数据定义一个新的内存地址。这样的话，修改A而不会影响B. 主要也是受到javascript的特性影响，跟vue本身设计无关。 大家都知道.vue的组件是可以复用的，这也就意味着如果我们的data是一个普通对象的话，所有复用了这个实例的组件都会引用同一份数据，就造成了数据污染。 摘抄：https://blog.csdn.net/weixin_45811884/article/details/107
组件中data为什么是个函数
weixin_49790903的博客
04-29 128
一、组件中的data 组件是可以复用的Vue实例，一个组件被创建好之后，就可能被用在各个地方，而组件不管被复用了多少次，组件中的data数据都应该是相互隔离，互不影响的，基于这一理念，组件每复用一次，data数据就应该被复制一次，之后，当某一处复用的地方组件内data数据被改变时，其他复用地方组件的data数据不受影响， 二、为什么data必须是一个函数 为什么组件中data必须是一个函数了而不是对象, 我们首先来看一下第一个声明式渲染的demo中data我们只在当前页面的挂载的div#app这个点上使用，
组件中 data 为什么是一个函数？
Menqq的博客
04-27 3542
因为，如果**data是一个对象则会造成数据共享**，在多次使用该组件时，改变其中一个组件的值会影响全部该组件的值。而如果是通过函数的形式返回出一个对象的话，在每次使用该组件时返回出的对象的地址指向都是不一样的，这样就能让各个组件的数据独立。 ...
组件中的data为什么是一个函数
weixin_44835897的博客
06-17 133
组件是可复用的vue实例，一个组件被创建好之后，就可能被用在各个地方，而组件不管被复用了多少次，组件中的data数据都应该是相互隔离，互不影响的，基于这一理念，组件每复用一次，data数据就应该被复制一次，之后，当某一处复用的地方组件内data数据被改变时，其他复用地方组件的data数据不受影响。 当data是一个函数的时候，每一个实例的data属性都是独立的，不会相互影响了。这都是因为js本身的特性带来的，跟vue本身设计无关。 js本身的面向对象编程也是基于原型链和构造函数，应该会注意原型链上添加一般都
data为什么是一个函数，而不是方法。
qq_49643195的博客
05-16 534
根实例对象data可以是对象也可以是函数（因为根实例是单例），不会产生数据的污染。 (根实例是:vue,组件实例是vuecomponents) 组件实例对象data必须为函数，目的是为了防止多个组件实例对象之间公用一个data，产生数据污染。如果用函数的形式，initData时会将其作为工厂函数都会返回全新data对象。 Object是引用数据类型,如果不用function返回，每个组件的data都是内存的同一个地址，一个数据改变了其他也就改变了，javascipt 只有构造函数构成作用域，data是
组件中data为什么是函数
weixin_45638909的博客
02-03 429
data是一个函数，但是返回的是一个对象，如果data直接是一个对象，会造成联动反应，即改变其中一个组件中的数据，其他的数据也会进行变化 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="app"> <cpn></cpn&gt
vue中的data为什么是一个函数
04-01
在Vue中，data被设计为一个函数，主要是因为在Vue实例化的时候，会对data进行一次浅拷贝，如果data直接是一个对象，那么这个对象就会被多个实例共享，这样就会导致一个实例的数据被修改，其他实例的数据也会跟着改变...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值