使用fetch來調用Web API是Vue開發中重要的一部分。在Vue中，我們可以輕松地使用fetch來向Web API發送GET、POST、PUT和DELETE請求，以便修改我們的數據源。

PUT請求可以幫助我們修改Web API中的資源。PUT請求是在指定的URL中創建或更新資源的方法。在Vue中，我們使用fetch API的文本方法來發送PUT請求。下面是一個例子：

fetch('http://myapi.com/data/1', {
method: 'PUT',
body: JSON.stringify(data),
headers:{
'Content-Type': 'application/json'
}
})
.then(res =>res.json())
.then(response =>console.log('Success:', response))
.catch(error =>console.error('Error:', error));

在這個例子中，我們使用fetch發送PUT請求來更新Web API中ID為1的數據對象。請求體中的數據是通過JSON.stringify轉換為字符串的JavaScript對象。請求頭中指定了Content-Type，因為服務器需要知道發送的數據是JSON數據。

在Vue中，我們可以把PUT請求封裝在一個方法中，使代碼更加模塊化和可讀。下面是一個使用Vue創建PUT請求的例子：

methods: {
updateData: function() {
fetch('http://myapi.com/data/1', {
method: 'PUT',
body: JSON.stringify(this.data),
headers:{
'Content-Type': 'application/json'
}
})
.then(res =>res.json())
.then(response =>console.log('Success:', response))
.catch(error =>console.error('Error:', error));
}
}

在這個例子中，我們使用Vue的methods選項來創建一個名為updateData的方法。這個方法包含了我們之前提到的PUT請求的代碼，可以被調用，在我們的Vue應用程序中以進行修改數據的操作。

另外，我們也可以在Vue的生命周期鉤子函數中調用這個方法，以便在Vue組件渲染完成后自動發送PUT請求，例如mounted()或created()。下面是一個使用Vue的mounted()方法的例子：

mounted: function() {
this.updateData();
}

總的來說，使用Vue來發起PUT請求是在Web API中修改數據的常見方式。我們可以把PUT請求封裝在Vue的methods函數中，以便在應用程序中以進行數據更新操作。除此之外，我們還需要注意請求頭中指定的內容類型，以便Web API在接收到我們的請求后能夠正確地解析請求體中的數據。