javascript - 如何在 Vue.js 中使用 SMTP.js - 导入外部脚本

Question

Helle，我在 Vue.js 中使用 smtp.js 及其外部脚本时遇到问题。问题是 mail.js，但我无法将外部脚本加载到我的 vue 组件中。然后尝试使用 vue-plugin-load-script for npm 解决这个问题，但这对我不起作用。我的 Vue 组件：

<template>
  <v-container class="mt-10">
    <v-card max-width="400px" class="mx-auto mt-5">
      <v-card-title>If You've got a question?</v-card-title>
      <v-card-subtitle>Type it in below!</v-card-subtitle>
      <v-card-text>
          <v-text-field label="Your Name" v-model="name"></v-text-field>
          <v-text-field label="Your Email" type="email" v-model="email"></v-text-field>
          <v-textarea label="Your Message" counter="100" maxlength="100" auto-grow outlined v-model="message"></v-textarea>
      </v-card-text>
      <v-card-actions>
          <v-btn class="mx-auto mb-4 success" @click="sendEmail">Send Message</v-btn>
      </v-card-actions>
    </v-card>    
  </v-container>
</template>

<script>
export default {
    name: 'Contact',
    data: () => ({
        email: "",
        message: "",
        name: "",

    }),
    methods: {
      sendEmail(){
        this.$loadScript("https://smtpjs.com/v3/smtp.js")
        .then(Email => {                                         //this Promise return nothing!!!
            Email.send({
                SecureToken : "3df7ff95-181c-4f27-9e94-ee2cfc280818",
                To : '[e-mail]',
                From : this.email,
                Subject : this.name,
                Body : this.message,
            }).then(
                message => alert(message)
            );
        })
        .catch(() => {
        // Failed to fetch script
        });

        },
    },

}
</script>

vue-plugin-load-script 在 main.js 中导入，如下所示：

import LoadScript from 'vue-plugin-load-script';

Vue.use(LoadScript);

我希望你能帮我解决这个问题。谢谢。

标签： javascriptvue.jssmtpvuetify.js