通過axios發送HTML表單

Question

在我的Vue應用程序中，當我點擊Submit時，我有一個常規的<form> ，它可以發送正確的數據，但不會在請求上設置身份驗證標頭。 我已將axios配置為在每個請求上附加這些標頭，因此我需要通過axios發送數據。

從axios文檔中，我知道我可以發布這樣的數據

axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })

並且我還知道可以通過將@submit.prevent="handleSubmit添加到<form>標記中來在表單發布上運行自定義函數。

我無法解決的是如何從表單輸入中獲取所有值並通過axios發送它。

Answer 1

在handleSubmit函數中，可以使用FormData類，例如：

handleSubmit (event) {
    event.preventDefault()
    let formData = new FormData(event.target)
    axios.post('/user', formData).then(response => ...).catch(error => ...)
}