项目中有一个需求,在切换视频播放源之后,需要恢复之前设置的播放速率。经过试验发现,如果在切换播放源之后,立即设置播放速率是不生效的,需要在视频加载完成之后设置才生效,因此这边需要切换播放源的时候保存一个回调,在 onPlay
事件触发的时候设置播放速率:
import bus from "EventBus";
export default {
data() {
return {
rateChangeEvent: null;
}
},
mounted() {
bus.$on('onPlay', bus.$emit('handleSetRateAsync'));
},
methods: {
handleReplaceSource() {
// do something
this.rateChangeEvent = () => console.log('设置播放速率');
bus.$on('handleSetRateAsync', () => {
this.rateChangeEvent && this.rateChangeEvent();
this.rateChangeEvent= null;
})
}
}
}
需要事件触发一次,更优雅的写法:
import bus from "EventBus";
export default {
mounted() {
bus.$on('onPlay', bus.$emit('handleSetRateAsync'));
},
methods: {
handleReplaceSource() {
// do something
bus.$once(
'handleSetRateAsync',
() => console.log('设置播放速率')
);
}
}
}
事件触发更优雅的写法:
import bus from "EventBus";
export default {
methods: {
handleReplaceSource() {
// do something
bus.$once(
'onPlay',
() => console.log('设置播放速率')
);
}
}
}