Vue中音乐播放器
一.安装依赖
yarn add vue-aplayer
or`
npm i vue-aplayer
二.使用
<template>
<div class="vue_aplayer">
<aplayer autoplay
:music="{
title: '歌曲标题',
artist: '歌手名',
src: '歌曲url',
pic: '歌曲播放器封面url'
}"
/>
</div>
</template>
<script>
import aplayer from 'vue-aplayer'
export default {
name: "VueAplayer",
components: {
aplayer
}
}
</script>
<style scoped>
</style>
三.官方文档
Vue中音乐播放器的更多相关文章
- vue实现音乐播放器实战笔记
原文链接:https://blog.csdn.net/Forever201295/article/details/80266600 一.项目说明该播放器的是基于学习vue的实战练习,不用于其他途径.应 ...
- Vue实现音乐播放器(七):轮播图组件(二)
轮播图组件 <template> <div class="slider" ref="slider"> <div class=&qu ...
- Vue实现音乐播放器(四):页面入口+header组件的编写
首先下载三个包 babel-runtime对es语法进行转义 fastclick解决移动端点击300毫秒延迟的问题 babel-polyfill对es6 api进行转义 下载了包之后要在main.js ...
- Vue实现音乐播放器(六):jsonp的应用+抓取轮播图数据
用jsonp来获取数据 通过封装方法来获取 在src文件夹下的api文件夹里面去封装一些获取相关部分组件的数据的方法 在api文件夹下的recommend.js中 配置一下公共参数 请求的真实的u ...
- Vue实现音乐播放器(二)-Vue-cli脚手架安装
- 02 Vue介绍与安装,指令系统 v-*、音乐播放器
VUE文档 https://cn.vuejs.org/v2/guide/ 1.vue的介绍 尤雨溪 1.vue的优点 2.vue的介绍 3.vue的安装 4.声明式渲染 <body> &l ...
- vue——一个页面实现音乐播放器
请忽略下面这段文字年关将至,时间好歹又多出了些许.却不敢过度消遣.岁月未曾饶过我,我亦不想饶过岁月.且将它塞得膨胀,让这一年看似加更充实.不曾料想我一个爱些风花雪月.研墨行歌之人,却做起了碼农这一行当 ...
- 如何用vue打造一个移动端音乐播放器
写在前面 没错,这就是慕课网上的那个vue音乐播放器,后台是某音乐播放器的线上接口扒取,虽然这类项目写的人很多,但不得不说这还是个少有的适合vue提升的好项目,做这个项目除了想写一个比较大并且功能复杂 ...
- 【大结局】《从案例中学习JavaScript》之酷炫音乐播放器(四)
这是之前写的用H5制作的音乐播放器,前三节其实已经做得差不多了,音轨的制作原理已经在上一节说明,不过一直还没有和音乐对接. 本章作为该系列的一个完结篇,我会专门把动态音轨的实现代码贴出来,demo地址 ...
随机推荐
- windows 服务 安装、卸载
1.新建项目 选中windows服务 2.添加安装程序 3.修改安装代码 ServiceProcessInstaller processInstall; ServiceInstaller servic ...
- CountDownLatch、CyclicBarrier和Semaphore使用
CountDownLatch CountDownLatch是用来线程计数的.等待一组线程全部执行完后再本线程继续执行.如:A线程需要等待B.C和D(由初始化CountDownLatch参数觉得等待多少 ...
- java生成随机验证码图片
import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; i ...
- AirFlow常见问题汇总
airflow常见问题的排查记录如下: 1,airflow怎么批量unpause大量的dag任务 普通少量任务可以通过命令airflow unpause dag_id命令来启动,或者在web界面点 ...
- rpyc + plumbum 实现远程调用执行shell脚本
rpyc可以很方便实现远程方法调用, 而plumbum则可以实现在python中类似shell的方式编码: 具体实现代码如下: Server.py import rpyc from rpyc.util ...
- Lucene 全文检索入门
博客地址:http://www.moonxy.com 一.前言 Lucene 是 apache 软件基金会的一个子项目,由 Doug Cutting 开发,是一个开放源代码的全文检索引擎工具包,但它不 ...
- django 中namespace的问题
在早期的django版本中 urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^polls/', include('polls.urls' ...
- SpringBoot之简单入门
一,spring boot 是什么? spring boot的官网是这样说的: Spring Boot makes it easy to create stand-alone, production- ...
- 使用SpringDataRedis的入门
在使用ssm框架下,我们会到redis做缓存. 1> 第一步,导包. <!-- Redis客户端 --> <dependency> <groupId>redi ...
- 夯实Java基础系列5:Java文件和Java包结构
目录 Java中的包概念 包的作用 package 的目录结构 设置 CLASSPATH 系统变量 常用jar包 java软件包的类型 dt.jar rt.jar *.java文件的奥秘 *.Java ...