Vue如何解决Uncaught语法错误:函数语句需要函数名称



我正在尝试创建一个通过Telegram进行身份验证的简单web应用程序。Telegram有自己的带有回调的小部件,它在登录后返回用户数据。问题是在脚本属性"data onauth"中,您可以在成功验证后传递要执行的回调。

(https://core.telegram.org/widgets/login-小部件文档(如果需要(

要将登录按钮定位在您想要的位置,您只需要粘贴Telegram的小部件生成器提供的脚本,但由于我无法在组件模板中粘贴脚本标记(vue只是不会编译它,只是返回错误(,我选择创建脚本元素添加所需的属性并将其附加到mounted((中。

这是我的组件代码

<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>

但当我尝试这样做时,我会得到UncaughtSyntaxError:函数语句需要函数名。我不知道该怎么解决。提前感谢,并为我糟糕的英语感到抱歉

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

最新更新