App.vue
<template>
<div id="app">
<my-parent></my-parent>
</div>
</template>
<script>
import MyParent from "./views/Parent";
export default {
components: {
MyParent
}
};
</script>
<style>
</style>
Parent.vue
<template>
<div>
<h2>Parent</h2>
<my-child v-bind:msg="`from Parent`"></my-child>
</div>
</template>
<script>
import MyChild from "./Child";
export default {
components: {
MyChild
}
};
</script>
<style>
</style>
Child.vue
<template>
<div>
<h2>Child</h2>
{{msg}}
</div>
</template>
<script>
export default {
props: {
msg: {
type: String,
default: ""
}
}
};
</script>
<style>
</style>