Для вывода (интерполяции) данных из переменных в заголовок страницы (title) во Vue.js вы можете использовать директиву v-bind или ее краткий синтаксис :.
Прежде всего, у вас должен быть корневой элемент Vue (обычно это элемент с id="app"), в котором вы определяете свойство data, содержащее переменные, данные которых вы хотите использовать. После этого вам нужно использовать интерполяцию {} внутри атрибута title, чтобы указать Vue, что это выражение и должно быть вычислено.
Вот пример кода, иллюстрирующий этот процесс:
<!DOCTYPE html>
<html>
<head>
<title>{{ pageTitle }}</title>
</head>
<body>
<div id="app">
<!-- Ваше приложение Vue.js -->
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
pageTitle: 'Добро пожаловать на мою страницу!'
}
});
</script>
</html>
В этом примере {{ pageTitle }} будет интерполировано в <title> и отобразится на вкладке браузера.
Таким образом, вам просто нужно установить значение переменной в свойстве data вашего экземпляра Vue, а затем использовать интерполяцию {{}} в нужном месте вашего Vue-приложения, включая заголовок страницы.