紫衣仙女
2019-02-15 18:12:05
我像想用vue搭建一個關(guān)于音樂播放器的功能 但是其中上一首 下一首則是用數(shù)組循環(huán)出來數(shù)組中存放著我的本地路徑如new Vue({ el:"body", data:{ arr: [{ name: 'music/ttdd.mp3',//這是路徑 singer: 'xxxxxxx'},, { name: 'music/xxxxxxxx.mp3', singer: 'xxxxx' }], index:0, music:"" }, methods:{ next:(){//這是我點擊下一首的函數(shù) this.index++ if(this.index>this.arr.length-1){ this.index=0 } this.music=this.arr[this.index].name } }})但是我頁面渲染的時候是這樣寫的//以前當(dāng)是數(shù)組的時候我是這樣寫的<audio autobuffer v-for=“i in arr” :src=['path/'+i.name] autoloop loop controls v-el:audio></audio>//這樣是可以使用的但是只要是單個數(shù)據(jù)時<audio autobuffer :src=['path/'+music] autoloop loop controls v-el:audio></audio>然后:src=music也是報錯的究竟怎樣才能把數(shù)據(jù)綁定到元素的屬性上呢
1 回答

守候你守候我
TA貢獻1802條經(jīng)驗 獲得超10個贊
我給你改寫一下吧,也可以吧src上綁定的東西搞成一個計算屬性,方便其他位置用
new Vue({
el:"body",
data:{
arr: [{ name: 'music/ttdd.mp3',//這是路徑
singer: 'xxxxxxx'},,
{ name: 'music/xxxxxxxx.mp3',
singer: 'xxxxx'
}],
index:0
},
methods:{
next:(){//這是我點擊下一首的函數(shù)
this.index++
if(this.index>this.arr.length-1){
this.index=0
}
}
}
})
//這樣是可以使用的但是只要是單個數(shù)據(jù)時
<audio autobuffer :src="'path/'+arr[index].name" autoloop loop controls v-el:audio></audio>
添加回答
舉報
0/150
提交
取消