Как решить Uncaught SyntaxError: операторы функций требуют имени функции

Question

Я пытаюсь создать простое веб-приложение с аутентификацией через Telegram. Telegram имеет свой собственный виджет с обратным вызовом, который возвращает вам пользовательские данные после входа в систему. И проблема в атрибуте скрипта «data-onauth», здесь вы передаете обратный вызов, который вы хотите выполнить после успешной аутентификации.

(https://core.telegram.org/widgets/login - документация виджета, если вам это нужно)

Чтобы найти кнопку входа в нужное вам место, вам просто нужно вставить скрипт, предоставленный генератором виджетов Telegram, ноТак как я не могу вставить тег script в шаблон компонентов (vue просто не скомпилирует его и просто вернет ошибку), я решил создать элемент script, добавить необходимые атрибуты и добавить его в mount ().

Вот мой код компонента

<template>
  <header>
      <div class="auth" id="telegramAuth">
      </div>
  </header>
</template>

<script>
export default {
  name: "Header",
  data: () => ({}),
  mounted() {
    let telegramAuth = document.createElement("script");
    telegramAuth.setAttribute("async", "");
    telegramAuth.setAttribute(
      "src",
      "https://telegram.org/js/telegram-widget.js?7"
    );

    telegramAuth.setAttribute("data-userpic", "false");
    telegramAuth.setAttribute("data-telegram-login", "t_adv_bot");
    telegramAuth.setAttribute("data-size", "large");
    telegramAuth.setAttribute("data-onauth", this.loginWithTelegram);
    telegramAuth.setAttribute("data-request-access", "write");
    document.querySelector("#telegramAuth").appendChild(telegramAuth);
  },
  methods: {
    loginWithTelegram: function onTelegramAuth(user) {
        console.log(user);
    }
  }
};
</script>

Но когда я пытаюсь это сделать, я получаю Uncaught SyntaxError: Операторам Function требуется имя функции. И я не знаю, как это решить. Заранее спасибо и извините за мой плохой английский

Answer 1

  methods: {
    loginWithTelegram(user) {
     console.log(user);
    }
  }