在開發網站和應用程序時，我們經常需要從服務器獲取圖片url來顯示圖片。在Vue應用程序中，我們可以使用Vue-resource或Axios等HTTP客戶端庫來獲取圖片url。這些庫使得從服務器獲取數據變得非常簡單，我們只需要一些基本的代碼就可以完成這個任務。

首先，我們需要在Vue中引入Vue-resource或axios。可以使用Vue-CLI創建一個新的Vue項目，然后在項目中安裝對應的庫。例如，使用npm安裝Vue-resource：

npm install vue-resource --save

或者，使用npm安裝axios：

npm install axios --save

一旦引入了這些庫，我們就可以使用它們來獲取圖片url。對于Vue-resource，我們可以使用以下代碼：

Vue.http.get('/api/getImageURL').then(response =>{
this.imageURL = response;
});

其中，'/api/getImageURL'是我們從服務器獲取圖片url的地址。我們可以將其替換為實際的地址。response是從服務器返回的數據。在這個例子中，我們將response分配給了Vue組件中的imageURL。

對于axios，我們可以使用以下代碼：

axios.get('/api/getImageURL').then(response =>{
this.imageURL = response;
});

這段代碼與Vue-resource類似，只是使用了不同的庫。我們可以使用相同的方式將response分配給Vue組件中的imageURL。

在獲取圖片url之后，我們可以將其分配給Vue組件中的img標簽。例如：

這將動態地在img標簽中添加src屬性，并將其值設置為獲取的圖片url。這樣，我們就可以在Vue應用程序中顯示從服務器獲取的圖片。

總的來說，Vue是一個非常好的用于前端開發的框架。它可以與許多不同的HTTP客戶端庫一起使用，如Vue-resource和axios。使用這些庫，我們可以輕松地從服務器獲取圖片url。一旦我們從服務器獲取到了圖片url，我們就可以將它賦值給Vue組件中的img標簽，然后在網頁上顯示圖片。這讓我們的工作變得更加容易和高效。希望這篇文章可以幫助你了解如何在Vue應用程序中獲取圖片url。