Skip to content

[vue] 在使用计算属性的时,函数名和data数据源中的数据可以同名吗? #558

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

[vue] 在使用计算属性的时,函数名和data数据源中的数据可以同名吗?

Activity

zyronon

zyronon commented on Jul 2, 2019

@zyronon

不可以,同名会报错:The computed property "xxxx" is already defined in data

llccing

llccing commented on Jul 4, 2019

@llccing
Myh-cs

Myh-cs commented on Jul 9, 2019

@Myh-cs

不能同名 因为不管是计算属性还是data还是props 都会被挂载在vm实例上,因此 这三个都不能同名

remip518

remip518 commented on Aug 21, 2019

@remip518

不可以,写在计算属性中的数据名称,不能在data中定义

wush12

wush12 commented on Nov 5, 2019

@wush12

不可以,因为初始化vm的过程,会先把data绑定到vm,再把computed的值绑定到vm,会把data覆盖了

ajh99990

ajh99990 commented on Dec 4, 2019

@ajh99990

莫名其妙的问题。可以同名,但data会覆盖methods。并且本就不该同名,同名说明你命名不规范。
然后解释为什么会覆盖,因为Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序,本质上这些都是要挂载到this上面的,你如果重名的话,后面出现的属性自然而然会覆盖之前挂载的属性了。如果你的eslint配置比较严格的话,同名是编译不通过的。

songkangle0826

songkangle0826 commented on Jun 1, 2020

@songkangle0826

莫名其妙的问题。可以同名,但data会覆盖methods。并且本就不该同名,同名说明你命名不规范。
然后解释为什么会覆盖,因为Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序,本质上这些都是要挂载到this上面的,你如果重名的话,后面出现的属性自然而然会覆盖之前挂载的属性了。如果你的eslint配置比较严格的话,同名是编译不通过的。

不可以,因为初始化vm的过程,会先把data绑定到vm,再把computed的值绑定到vm,会把data覆盖了

其实是可以同名的, 不是先把data绑定到vm,初始化顺序是这样的,先computed,methods,data,props

Good-XiaAo

Good-XiaAo commented on Sep 6, 2020

@Good-XiaAo

为什么会有这样的问题?有点脑残了吧

TieHanHanYa

TieHanHanYa commented on Oct 25, 2020

@TieHanHanYa

莫名其妙的问题。可以同名,但data会覆盖methods。并且本就不该同名,同名说明你命名不规范。
然后解释为什么会覆盖,因为Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序,本质上这些都是要挂载到this上面的,你如果重名的话,后面出现的属性自然而然会覆盖之前挂载的属性了。如果你的eslint配置比较严格的话,同名是编译不通过的。

不可以,因为初始化vm的过程,会先把data绑定到vm,再把computed的值绑定到vm,会把data覆盖了

其实是可以同名的, 不是先把data绑定到vm,初始化顺序是这样的,先computed,methods,data,props

正确顺序:props、methods、data、computed、watch、

laozhan0000

laozhan0000 commented on Nov 11, 2020

@laozhan0000

不可以,会报错,
[Vue warn]: The computed property "a" is already defined in data.

crush2020

crush2020 commented on Jan 28, 2021

@crush2020

不能同名,不管是方法,计算属性还是data最后都会挂载到vue实例上去,如果同名了就会把其中一条覆盖掉,那你写的计算属性,方法,在data中定义的数据,就没有什么意义了

hyj443

hyj443 commented on Oct 27, 2021

@hyj443

在initComputed执行时,会先看看当前vm实例的原型链上有没有这个key,用的in操作符判断

如果没有,那就创建computed
如果有,是不会创建的,并会看看它在哪里被你定义过,然后依次看看是不是在data props methods里被定义了,告诉你别和他们重名了。

wenjiechen0913

wenjiechen0913 commented on Apr 27, 2023

@wenjiechen0913

computed
真的就有这种问题吧

wenjiechen0913

wenjiechen0913 commented on May 6, 2023

@wenjiechen0913

Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序,本质上这些都是要挂载到this上面的,你如果重名的话,后面出现的属性自然而然会覆盖之前挂载的属性了。

image
人家说的初始化顺序没错,调用顺序就是这样的

wenjiechen0913

wenjiechen0913 commented on May 6, 2023

@wenjiechen0913

不能同名 因为不管是计算属性还是data还是props 都会被挂载在vm实例上,因此 这三个都不能同名

可以同名的吧,只是会告警而已,又不会报错。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@llccing@Myh-cs@zyronon@ajh99990

        Issue actions

          [vue] 在使用计算属性的时,函数名和data数据源中的数据可以同名吗? · Issue #558 · haizlin/fe-interview