Vue框架是一款非常好用的前端框架，能夠為開發者提供優秀的前端應用開發體驗。在Vue框架中，我們可以通過簡單的代碼實現圖片的播放，下面將詳細介紹Vue框架中如何播放照片。

<template>
 <div>
<img :src="url"/>
<button @click="changePhoto">點擊切換照片</button>
 </div>
</template>
<script>
 export default {
data() {
return {
photos: [
"http://example.com/1.jpg",
"http://example.com/2.jpg",
"http://example.com/3.jpg"
],
index: 0
}
},
methods: {
changePhoto() {
let length = this.photos.length;
this.index = (this.index + 1) % length;
}
},
computed: {
url() {
return this.photos[this.index];
}
}
 }
</script>

在上面的代碼中，我們通過Vue中的模板語法展示圖片，并且通過按鈕的點擊事件來切換照片。首先，在Vue的<template>標簽中，我們使用了<img>標簽來展示圖片。在Vue中，我們可以使用v-bind指令將數據綁定到圖片的src屬性上，這個屬性對應的data數據是通過計算屬性computed中的url()方法計算得到的。

接下來，在我們的<script>標簽中，我們定義了一個Vue實例，并且定義了這個實例中的data數據。data中定義了一個photos數組和一個index變量，photos數組中存儲了三張照片的鏈接，index是一個計數器，表示圖片數組中當前展示的圖片序號。在methods中，我們定義了一個changePhoto()方法，每次點擊按鈕就會調用這個方法，改變圖片序號index，最后在computed中計算出當前需要展示的圖片鏈接url。

通過上面的代碼，我們已經可以在Vue中完成照片的播放功能，這個方法簡單易用，方便開發者快速實現應用。當然，Vue中還有更多強大的功能和語法，可以幫助我們更好的完成應用開發。