Как вы ждете vue. js созданного крючка? - PullRequest
0 голосов
/ 15 января 2020

У меня есть приложение vue. js, в котором мне нужно дождаться вызова API Prismi c. Проблема в том, что вызов начинается с созданного перехвата, но я не знаю, как сказать vue ждать перехвата.

Код выглядит так:

...
async created() { 
  await this.getContent();
}, 
methods : {
  async getContent () {
    let document = null;
    try {
      document = await this.$prismic.client.getSingle(...);
    } catch(err) {
      return;
    }

    // add content to meta tags
  },
  ....

Как вы видите, я жду вызова этого. $ prismi c .client.getSingle (...) перед установкой содержимого в метатегах (что работает нормально), но потому что для этого требуется метод getContent () чтобы быть asyn c, мне также нужно дождаться вызова this.getContent () в хуке созданного () ... что означает, что мне нужно сделать хук созданного () асин c. На данный момент я во власти Vue. Я не знаю, как сказать ему, чтобы он ожидал вызова функции create ().

Это важно, потому что мы пытаемся заставить поисковый сканер Google читать наши метатеги. Мы получаем противоречивые результаты. В консоли поиска Google он иногда находит теги, иногда нет. Мы пытаемся понять, поможет ли структура нашего кода асинхронному / ожидающему. Таким образом, сканер будет ждать выполнения javascript до окончания sh, прежде чем искать теги (или так мы ожидаем). Но если мы не можем ожидать вызова функции create (), нет смысла ожидать вызовов других методов.

Есть ли способ решить эту проблему? Спасибо.

РЕДАКТИРОВАТЬ: Вопрос на Доступно ли `async / await` в Vue. js` mount`? точно так же, как у меня, но решение не применять. Решением здесь является управление рендерингом компонента с помощью v-if = "flag", где flag устанавливается в конце метода asyn c. В моем случае я попал на поисковик Google, которым не могу управлять.

1 Ответ

0 голосов
/ 16 января 2020

Если this.$prismic.client.getSingle(...) возвращает обещание, вы можете сделать что-то вроде этого:

created() { 
  this.getContent();
}, 
methods: {
  getContent() {
    this.$prismic.client.getSingle(...)
      .then((response) => {
        // add content to meta tags
      })
      .catch((err) => {
        // error
      });
  }
}
...