1

While reading the excellent documentation of VueJS, I didn't understand how dynamic async component can get its props from its outer component.

Is that possible? How? They do have a great example here. What if my component has props like "something" need to be passes and render:

 <component :is="my-component"></component>

 Vue.component('my-component', { 
    template: '<div>{{something}}</div>',
    props: { something: String } 
})

Doing something like this will not work:

 <component :is="my-component" :something="'text'"></component>

:something is specific name of prop, but the component not always known, so its props are also not known. This is the senario why using so it can by any component.

tony19
  • 125,647
  • 18
  • 229
  • 307
Aviv M
  • 319
  • 1
  • 2
  • 12
  • Why does'nt it work? What is the error? – Thomas Oct 16 '18 at 09:00
  • [Vue warn]: Property or method "text" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. – Aviv M Oct 16 '18 at 09:01
  • This is because vue tries to find a methode or property with the name `text`. Just remove the colon before something and this error should be fixed. Or create a property `text` in your data object. – Thomas Oct 16 '18 at 09:03
  • Yes, this worked. What I meant to ask is how I can give the dynamic component all its props, which are dynamics. :something in my example is a name of specific prop, but the senario for using this is when you don't know what will be the component, it can be any component with any props. – Aviv M Oct 16 '18 at 09:08
  • But you have to know what has to be passed as props. There is no way that a child component tells the parent what it want's to recieve. Perhaps a store solution is better 4 you. Then each component could get it's data from the store and you do not have to pass anythig as props – Thomas Oct 16 '18 at 09:15
  • found the answer in here: https://stackoverflow.com/questions/43658481/passing-props-dynamically-to-dynamic-component-in-vuejs – Aviv M Oct 16 '18 at 10:52
  • The answer is here: [https://stackoverflow.com/questions/43658481/passing-props-dynamically-to-dynamic-component-in-vuejs](https://stackoverflow.com/questions/43658481/passing-props-dynamically-to-dynamic-component-in-vuejs) – Aviv M Oct 16 '18 at 10:53

0 Answers0