Vue-meta: у metaInfo нет доступа к вычисляемым свойствам

Question

Я использую vue-meta для динамического изменения моих метатегов. Я хочу изменить это только на некоторых конкретных страницах.

Я использую функцию metaInfo и пытаюсь изменить, например, название. Но данные из моего геттера не определены, поэтому я не могу изменить заголовок в метатегах. Кажется, что функция metaInfo пытается получить доступ к данным до того, как компонент действительно их получит.

Вот мой код в компоненте:

<template>
...
</template>

<script>
 export default {
     metaInfo() {
       return {
         title: this.getViewPage.data.meta.title, // data is undefined
    };
  },
  created() {
     this.loadViewPage();
  },
  computed: {
     ...mapGetters(['getViewPage']),
  },
  methods: {
     ...mapActions(['loadViewPage']),
};
</script>

Answer 1

vue-meta просто создает вычисленное свойство из вашего metaInfo функция (в соответствии с исходным кодом плагина), поэтому я предполагаю, что ваш loadViewPage действие заполняет data объект асинхронно, и ваша проблема просто превращается в задачу проверки на нуль.

Поэтому вы должны проверить данные перед использованием их свойств, и когда данные будут загружены, metaInfo также обновит объект:

     metaInfo() {
         // don't know your return object structure, 
         // maybe you should check whole this.getViewPage
         let data = this.getViewPage.data; 
         return {
             title: data ? data.meta.title : "some placeholder title",
         }
     };