[Vuejs]-Linking v-model in child to parent value vue js

by

0👍

Okay, so I guess there is somewhere the input element that has model binded to the textWidget, something like this: 

<input type="text" v-model="textWidget"/>

And you want to send this to your child component via props, so you did It like this

<text-widget v-show="getCurrentWidgetType() == 'text-widget'" :textWidget="textWidget"></text-widget>

This is almost good, but not enough because props in template should be formatted in the kebab-case, so this is correct setup

<text-widget v-show="getCurrentWidgetType() == 'text-widget'" :text-widget="textWidget"></text-widget>

And then you should define that prop into the component logic, so Vue can know what to use (you don’t need data model here now, except you have some another component based data):

// declaring the component just before my main vue app
Vue.component('text-widget', {
    template: `{% include('templates/widgets/text.html.twig') %}`,
    props: ['textWidget']
})
👤Belmin Bedak

Leave a comment