ref 또는 eventbus 를 사용한다. 여기서는 ref를 사용.

  • 부모 컴포넌트

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    <template>
    <custom-full-calendar ref="calendar" />
    </template>

    <script>
    import {CustomFullCalendar} from '@'

    export default {
    components: {
    CustomFullCalendar
    },
    methods: {
    nextWeekDate() {
    this.$refs.calendar.nextDate() // 자식 컴포넌트의 함수를 호출
    }
    }
    }
    </script>
  • 자식 컴포넌트

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<template>
<div class="custom-full-calendar" />
</template>

<script>
import {CustomFullCalendar} from '@'

export default {
methods: {
nextDate() {
console.log('다음 날짜 입니다')
}
}
}
</script>

Reference

https://stackoverflow.com/questions/40957008/how-to-access-to-a-child-method-from-the-parent-in-vue-js/47565763#47565763

Comment and share

Author's picture

Junho Nam

enjoy while living


full stack web developer


Seoul, Korea