Skip to content

[vue] 如何在子组件中访问父组件的实例? #477

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

[vue] 如何在子组件中访问父组件的实例?

Activity

yin-pathfinder

yin-pathfinder commented on Jun 28, 2019

@yin-pathfinder

this.$parent

lovelmh13

lovelmh13 commented on Jun 28, 2019

@lovelmh13

this.$parent拿到父组件实例
this.$children拿到子组件实例(数组)

qq326943819

qq326943819 commented on Jun 28, 2019

@qq326943819

this.$parent

HeMin0919

HeMin0919 commented on Jul 23, 2019

@HeMin0919

vue中如果父组件想调用子组件的方法,可以在子组件中加上ref,然后通过this.$refs.ref.method调用(https://www.cnblogs.com/jin-zhe/p/9523029.html)
Vue中子组件调用父组件的方法,这里有三种方法提供参考:
1:直接在子组件中通过this.$parent.event来调用父组件的方法
2:在子组件里用$emit向父组件触发一个事件,父组件监听这个事件
3:父组件把方法传入子组件中,在子组件里直接调用这个方法
https://www.cnblogs.com/jin-zhe/p/9523782.html)

radio-qq

radio-qq commented on Dec 31, 2020

@radio-qq

$refs也行

hyj443

hyj443 commented on Oct 19, 2021

@hyj443

子组件访问父组件:$parent

但少用 $parent 和 $children

它们主要用来应急,更推荐用 props 和 events 实现父子组件通信

如果子组件是公共组件,到处用,你在当前这个父组件下用没问题,但在别的地方用这个子组件,你还需要 $parent 吗?$parent 有对应的属性或方法吗?很容易产生bug,不利于调试。

所以这种写法是不被推荐的,官方文档有写。

Azenmy

Azenmy commented on Oct 22, 2021

@Azenmy

this.$emit

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@yin-pathfinder@lovelmh13@qq326943819@hyj443

        Issue actions

          [vue] 如何在子组件中访问父组件的实例? · Issue #477 · haizlin/fe-interview