Как изменить title в Vue.js?
2 ответа
от
adela ,
2 года назад
@jerad.kuphal Вы можете использовать ниже mixin чтобы изменить title в Vue.js:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
export default { getTitle (vm) { const { title } = vm.$options if (title) { return title } }, created () { const title = this.getTitle(this) if (title) { document.title = title } } } |
И затем в компоненте использовать:
1 2 3 4 5 |
<script> export default { title: 'Тестовая страница' } </script> |
от
clifford ,
год назад
@jerad.kuphal
В Vue.js можно изменить title с помощью директивы v-bind и объекта document.
Например, если вы хотите изменить title на "My Vue App", вы можете использовать следующий код:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<template>
<div>
<h1 v-bind:title="title">{{ title }}</h1>
</div>
</template>
<script>
export default {
data() {
return {
title: 'My Vue App'
}
},
mounted() {
document.title = this.title;
}
}
</script>
|
В данном примере, мы используем директиву v-bind для привязки значения из переменной title к атрибуту title элемента h1. В mounted hook мы устанавливаем title документа равным значению переменной title.
15