我正在使用一個圖示，并在單擊它時進行 API 呼叫：
<i class="fas fa-sync" @click.prevent="updateCart(item.id, item.amount)"></i>
所以我想用影片打開它，直到 API 呼叫完成或兩秒鐘。但我不知道如何做到這一點，所以如果你能給我一個很好的解決方案。
uj5u.com熱心網友回復：
您可以簡單地切換 CSS 影片（或運行影片的類），例如使用：
const MyIcon = Vue.extend({
template: `
<i :style="(loading ? 'animation: spin 1s infinite;' : '')" @click.prevent="updateCart"></i>
`,
data() {
return {
loading: false,
}
},
methods: {
updateCart() {
this.loading = true
// Do your stuff here and set to false when you're done
setTimeout(() => this.loading = false, 2000)
}
}
})
旋轉可能是這樣的：
@keyframes spin {
from { transform: rotateZ(0deg) }
to { transform: rotateZ(360deg) }
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/345046.html