[Vuejs]-How to store a value from another component's data?

0👍

You can do this by using $emit.

Create.vue

<template>
    <div id="main">
        <Editor
            @edit={onChangeText}
        />
        //some codes here
    </div>
</template>

<script>
import Editor from './_Create_Editor.vue'

export default {
    components: { Editor },
    data: () => ({
        text: ''
    }),
    methods: {
        onChangeText: function (value) {
            this.text = value
        }
    }
}
</script>

_Create_Editor.vue

<template>
    //sample input for demonstration purposes
    <input
        type="text"
        class="form-control"
        @change="onChange"
    />
</template>
<script>
export default {
    methods: {
        onChange: function (event) {
            this.$emit('edit', event.target.value)
        }
    }
}
</script>

Leave a comment