Vue.js - How to pass down props to grandchildren

user_801033 0
Viewed 607

I have the following App structure

RegistrationView (holds the data logic like get, post)
 - RegistrationForm (holds the form)
 -- Registration Radio Component (radio buttons rendered on delivered data from view)

and I would like to be able to pass down data from view to radios Component as props to be rendered and interact with parent form component. Is this possible?

vue-props vuejs2 vue-component vue.js javascript
1 Answers

You need to use dependency injection in this case :

in view :

provide: function () {
  return {
    prop1: this.someData,
    someMethod:this.someMethod
  }
},
data(){
  return{
    someData:'some data'
  }
},
methods:{
    someMethod(){
       this.someData='another data'
    }
}

in radios component :

inject: ['someData','someMethod']

and use it like this.someData and you could trigger this.someMethod() and it will change the data in grandparent component.

user_81728570
Related