用vuejs发送电子邮件

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (725)

我想发送带有laravel和vuejs的电子邮件。我写了laravel控制器函数,如下所示

Mail::send(['text' => 'mail'],['name', 'David'], function($message){
    $message->to('test123@gmail.com')->subject('Test Email');
    $message->from('testmail@gmail.com', 'David');
});
return response()->json(['success'=>true]);

我为@click方法写了一个vuejs发送电子邮件功能

this.axios.get('https://techwizlanka/send', {
    body: JSON.stringify(this.user),
    headers: {
        'content-type': 'application/json',
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
})
.then(res => res.json())
.then(data => {
    console.log("email sent");
})
.catch(err => console.error(err.toString()));

我这样称呼这个URL

Route::get('/send', 'MailController@sendMail'); 

但是单击“发送”按钮时会显示此错误消息。

app.js:44786 Uncaught TypeError:无法在调用者(app.js:34769)的HTMLButtonElement.fn._withTask.fn._withTask(app.js)中读取VueComponent.sendMail(app.js:44786)中未定义的属性'get' :34568)

任何人都可以帮我解决这个问题吗?基本上,我想在提交带有laravel和vuejs的表单时发送电子邮件。

提问于
用户回答回答于

尝试使用此方法

axios.post(url, data)
      .then(response => {

})

并在您的路线/ web.php中发布您的路线

在使用get方法函数不期望请求但在您的情况下您传递请求。

用户回答回答于

肯定是因为你没有axios正确打电话。请确保有哪些呢thisthis.axios参考。

假设您使用了安装axiosnpm install axios。然后尝试或多或少地导入和使用axios如下:

import axios from 'axios';

export default {
  data() {
    return {
        user: [],
    };
  },

  methods: {
    click() {
        axios
        .get('https://techwizlanka/send', {
            body: JSON.stringify(this.user),
            headers: {
                'content-type': 'application/json',
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
        })
        .then(res => res.json())
        .then(data => {
            console.log("email sent");
        })
        .catch(err => console.error(err.toString()));
    },
  },

  ...
}

扫码关注云+社区

领取腾讯云代金券