Vue js передача данных между компонентами
Всё перечитал. Не могу понять как передать статическое значение из одного дочернего компнента в другой. Пробовал и через $emit через родительский компонент и по-всякому. В документации пример понятен, но под свой случай подстроить его не могу. Использую vue.cli и компонентный подход.
App.vue обычный:
<template>
<div id="app">
<div class="flexing">
<questionPanel />
<router-view />
</div>
</div>
</template>
<script>
import firstQuestion from './components/firstQuestion'
import questionPanel from './components/questionPanel'
export default {
name: 'App',
components: {
first,
questionPanel,
},
}
</script>
Есть первый компонент first.vue:
<template>
<h1>{{ title }}</h1>
</template>
<script>
export default {
name: 'first',
components: {},
props: {},
data() {
return {
title: 'Текст первого вопроса',
}
},
}
</script>
Есть второй questions.vue:
<template>
</template>
import first from './first.vue'
<script>
export default {
name: 'questions',
components: {
first
},
props: ['title'],
data() {
return {
questions: 'questions'
}
}
}
</script>
Как мне отобразить title в questions ?
Большое спасибо!