A Vue.js bullet screen plugin
npm install vue-bullet-screen --save
import VueBulletScreen from 'vue-bullet-screen'
Vue.use(VueBulletScreen)
<script src="/dist/vue-bullet-screen.js"></script>
<vue-bullet-screen v-bind:bulletList="bulletList" ref="vueBulletScreen"></vue-bullet-screen>
export default {
name: 'app',
data() {
return {
id: 0,
message: 'vue bullet screen'
bulletList: []
}
},
methods: {
addBullet() {
this.bulletList.push({
id: ++id,
avatar: "/static/logo.png",
message: this.message,
time: 5
});
},
play() {
this.$refs.vueBulletScreen.play();
},
stop() {
this.$refs.vueBulletScreen.stop();
}
...
Recognizer | Type | Default | Example |
---|---|---|---|
show | Boolean | true | v-bind:show="isShow" |
loop | Boolean | false | v-bind:loop="isLoop" |
bulletList | Array | [ ] | v-bind:bulletList="bulletList" |