call parent method in child component using vue.js

user_12367327 0
Viewed 2543

hello everyone i jusy wanna know how to call a perent function from a child component i've tried to use the $parent to call the perent method but i have this error typeError: _this.$parent.forceRender is not a function here's the parent method that i'm trying to call

methods: {
      forceRender() {
        this.componentKey += 1
      }
    },

and here's the child component as you can see i'm trying to call the parent method using the $parent

this.$parent.forceRender()
vue.js parent components methods parent-child
2 Answers

You can send the functions as a props to the child component jus like follows

<child-component :forceRender="forceRender" />

inside the child component you can received it like this

props: ['forceRender']

and then call it as

this.forceRender()
user_112811520

You should emit an event from child to parent component in order to run a parent method :

in child component:

this.$emit('force-render')

in parent component add @force-render to component tag with forceRender as handler :

<child-component @force-render="forceRender" />
user_81728570
Related