Есть основной шаблон app.vue. Представлет из себя шапку с кнопкой и подтягивающимся контентом из дочерних компонентов в router-view
<template>
<div id="app">
<CreateButton
:link = "createLink"/>
<router-view class="text-center mt-12 container"></router-view> //здесь отображаются дочерние компоненты
</div>
</template>
<script>
import CreateButton from './components/includes/CreateButton'
export default {
name: 'App',
components: {
CreateButton
},
data() {
return {
createLink: 'UserCreate',
}
},
}
</script>
Как видите я подключаю ссылку-компонент
CreateButton
, вот он:
<template>
<router-link
:to="{ name: link }"
class="btn btn-success">+</router-link>
</template>
<script>
export default {
props: ['link']
}
</script>
Когда я перехожу в дочерний компонент (по факту другая страница внутри этой) я хочу переопределить createLink , с
'UserCreate' на, скажем
'DeleteUser'
Пробовал в дочернем прописать:
data() {
return {
createLink: 'DeleteUser',
}
},
Но ожидаемо не работает.
Подскажите пожалуйста что нужно сделать, чтоб иметь возможность переопределять во всех компонентах
createLink
Читал про $emet, но это похоже не то - у меня нет же событий....