Как получить title страницы в шаблоне nuxt?

156
23 августа 2021, 08:30

Как получить title страницы в шаблоне nuxt если title задан в отдельном файле который является частью общего шаблона?

Answer 1

Если не ошибаюсь, то в nuxtjs возможно добавить title двумя способами:

  1. в nuxt.config.js
export default {
  head: {
    titleTemplate: '%s - Nuxt.js',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      // hid is used as unique identifier. Do not use `vmid` for it as it will not work
      { hid: 'description', name: 'description', content: 'Meta description' }
    ]
  }
}
  1. используя метод страницы head()
<template>
  <h1>{{ title }}</h1>
</template>
<script>
export default {
  data () {
    return {
      title: 'Hello World!'
    }
  },
  head () {
    return {
      title: this.title,
      meta: [
        // hid is used as unique identifier. Do not use `vmid` for it as it will not work
        { hid: 'description', name: 'description', content: 'My custom description' }
      ]
    }
  }
}
</script>

Скорее всего, как и asyncData, head не сработает в компоненте, этот метод работает только в страницах (*.vue файлах лежащих в папке /pages).

Получить же в title в самом шаблоне, можно например так:

<template>
  <h1>{{ title }}</h1>
</template>
<script>
export default {
  data () {
    return {
      title: ''
    }
  },
  mounted () {
    this.title = document.title
  }
}
</script>
Answer 2

Если правильно Вас понял и ещё актуально:

this.$meta().resume().metaInfo.title

Подробнее: nuxt.js - meta

READ ALSO
Как решать неравенства js?

Как решать неравенства js?

решил создать небольшую утилитку для решение функций графиковНо столкнулся с проблемой

139
JS Regex требуется помощь

JS Regex требуется помощь

Я не сильно в regex и это моя проблемаПомогите составить пожалуйста, чтобы в конце строки в обязательном порядке было слово production после тире

245
Как запретить вводить минус после цифры в input

Как запретить вводить минус после цифры в input

Столкнулся со странной ситуацией, инпут дает возможность ввести "+" или "-" после числа, как такое можно побороть? Мне нужна возможность вводить...

109
Не работает пример из книги javascript [закрыт]

Не работает пример из книги javascript [закрыт]

Хотите улучшить этот вопрос? Обновите вопрос так, чтобы он вписывался в тематику Stack Overflow на русском

184