vue3.0 音频插件(vue-aplayer)


上篇文章咱们说了怎么使用 视频插件vue-vedio-player那么咱们固然也有音频插件了html

咱们选择使用vue-aplayervue

  • 一样咱们先安装这个插件

npm install vue-aplayer -sgit

  • 咱们须要在main.js里面导入并引用
import vueAplayer from 'vue-aplayer'
 
Vue.use(vueAplayer)复制代码
  • 那么咱们怎么使用了?
  • 首先咱们须要在使用的vue文件里面引入他
import aplayer from 'vue-aplayer'

export default {
    components: {
      aplayer
    }
}复制代码
  • 咱们的html部分
<template>
    <div style="width: 60%">
         <aplayer :music="videoUpload.music"></aplayer>
    </div>
</template>复制代码
  • js部分
<script>
    export default {
        data() {
            return {
                videoUpload: {
                    progress: false,
                    progressPercent: 0,
                    successPercent: 0,
                    music: {
                       title: '',
                       author: '',
                       url: '',
                       lrc: '[00:00.00]lrc here\n[00:01.00]aplayer'
                   }
                },
            }
        }
    }
</script>复制代码
  • 最后咱们来看一下效果

相关文章
相关标签/搜索