1、安装 npm: npm install aplayer--save AI代码助手复制代码 Yarn: yarnaddaplayer AI代码助手复制代码 2、页面中引入 importAPlayerfrom'APlayer';import'APlayer/dist/APlayer.min.css'; AI代码助手复制代码 3、具体使用,源代码 (1)封装 aPlayer.vue <template></template>importAPlayerfrom'APlayer';import'APla...
vue-aplayer插件也可以实现音乐播放和歌词滚动,但是只有对应的Vue2.x版本 image.png npm下载aplayer插件 npm install aplayer --save 下载hls.js: npm install hls.js --save <template><!-- 准备一个容器用来存放音乐播放器 --></template> import APlayer from "aplayer"; // 引入音乐插件 import "aplayer/...
"fetch-jsonp": "^1.2.3", "pinia": "^2.0.23", "pinia-plugin-persistedstate": "^3.0.0", "swiper": "^9.3.2", "vue": "^3.3.4", "vue3-aplayer": "^1.7.3" "vue": "^3.3.4" }, "devDependencies": { "@icon-park/vue-next": "^1.4.2", 538 changes: 172 additions & 366...
自己弄新版博客想用APlayer,到github看了一圈没见有vue3版本的,所以就用基于Aplayer组件化了下,顺带看了下Meting.js,用Meting.js的服务去获取指定歌曲,详见代码 参考: https://github.com/DIYgod/APlayer https://aplayer.js.org/#/zh-Hans/ https://github.com/metowolf/MetingJS ...
import { MusicOne, PlayWrong } from "@icon-park/vue-next"; import { getPlayerList } from "@/api"; import { mainStore } from "@/store"; import aplayer from "vue3-aplayer"; import APlayer from "@worstone/vue-aplayer"; const store = mainStore(); @@ -36,32 +36,14 @@ const ...
import {nextTick, onBeforeUnmount, onMounted, ref}from'vue'constplayerRef=ref() let instance: APlayer;// APlayer歌曲信息classAudio{// 音频艺术家artist: String;// 音频名称name: String;// 音频链接url: String;// 音频封面cover: String;// 歌词lrc: String;constructor(artist: String,name: String...
import {nextTick, onBeforeUnmount, onMounted, ref} from 'vue' const playerRef = ref() let instance: APlayer; // APlayer歌曲信息 class Audio { // 音频艺术家 artist: String; // 音频名称 name: String; // 音频链接 url: String;
vue2的时候,分享了一个很好用的插件是vue-aplayer,但是他是不支持vue3的,这里分享vue3使用APlayer来实现一个播放器的方法。 实现效果: 官方: git地址:点我 api地址:点我 实现步骤: 1、安装 npm: npm install aplayer --save Yarn: yarn add aplayer ...
import {nextTick, onBeforeUnmount, onMounted, ref} from 'vue' const playerRef = ref() let instance: APlayer; // APlayer歌曲信息 class Audio { // 音频艺术家 artist: String; // 音频名称 name: String; // 音频链接 url: String; // 音频封面 cover: String; // 歌词 lrc: Strin...
import {nextTick, onBeforeUnmount, onMounted, ref} from 'vue' const playerRef = ref() let instance: APlayer; // APlayer歌曲信息 class Audio { // 音频艺术家 artist: String; // 音频名称 name: String; // 音频链接 url: String;