How do I pass the v-model through the wrapper component?

  • 0
    Hello. In my project I use Vuetify, for convenience I wrap all form elements with my component. I am interested in such a moment as the easiest way to link the v-model of the parent and child component. Now I use this construction.

    export default {
                    template: '<v-text-field v-model="model"></v-text-field>',
                    props: ['value'],
                    data(){
                            return {
                                    model: '',
                            }
                    },
    
                    created(){
                            this.model = this.value;
                    },
    
                    mounted() {
                            this.model = this.value;
                    },
                    watch: {
                            value(){
                                    this.model = this.value;
                            },
                            model(){
                                    this.$emit('input', this.model)
                            },
                    }
            }


    Tell me, can this be done even easier?
    JavaScript Anonymous, Aug 9, 2019

  • 1 Answers
  • 0
    The documentation describes how to create such wrappers.

    https://v3.vuejs.org/guide /component-basics.html#u ...
    Zachary Harper

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!