vue 親から子へのデータの受け渡し

Question

すいませんすごい初歩的なことなのですが、親から子へのテキストの情報の受け渡しがうまくいきません。。

親 Parent

<template>
    <div>
    
            <title text="テスト" />
    
    </div>
</template>

<script lang="ts">
import { Context } from '@nuxt/types'
import { Component,Prop, Vue } from 'vue-property-decorator'
import Title from '~/components/atoms/title.vue'

@Component({
    components: {
        Title
    }
})
export default class Parent extends Vue {}
</script>

<style scoped>
</style>

子 Child

<template>
	<div class="tit_wrap">
	
		<p class="tit">{{ text }}</p>
	
	</div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'

@Component({
})


export default class Child extends Vue {
    props: ['text']
}
</script>

<style scoped>
</style>

現在このような状態で子の受け渡しをしなければ特に何も問題なく
描画がされるのですが、これではなぜ表示されないのでしょうか？？

Answer 1

Vue側がHtmlの<title>タグとして認識しているのかも？
componentの名前をPageTitleにしたら動きました

---------------親-----------------------------------------
<template>

<div> <page-title text="テスト" /> </div> </template> <script lang="ts"> import PageTitle from './Title.vue' export default { components: { PageTitle } } </script> <style scoped> </style>

---------------/親-----------------------------------------

---------------子-----------------------------------------
<template>

<div class="tit_wrap"> <p class="tit">{{ text }}</p> </div> </template> <script lang="ts"> export default { props: ['text'] } </script> <style scoped> </style> --------------/子-----------------------------------------

Comments

[cheche0830]

ありがとうございます。
こちらの環境だとだめでした。。もう少し頑張ってみます・・

[oec]

わかりにくくてごめんなさい！親を↓にするだけで大丈夫だと思ったのですが、だめそうですか？

<template>
<div>

<page-title text="テスト" />

</div>
</template>

<script lang="ts">
import { Context } from '@nuxt/types'
import { Component,Prop, Vue } from 'vue-property-decorator'
import PageTitle from '~/components/atoms/title.vue'

@Component({
components: {
PageTitle
}
})
export default class Parent extends Vue {}
</script>

<style scoped>
</style>

[cheche0830]

できました！！！ありがとうございましした！

[oec]

無事できてよかったです！