Vuejs---《Vue.js + Node.js-构建音乐播放器新玩法-video》
官方文档:http://vuejs.org/v2/guide/syntax.html
中文文档: https://cn.vuejs.org/v2/guide/syntax.html
兼容性
Vue.js 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性。Vue.js 支持所有兼容 ECMAScript 5 的浏览器。
以为没有处理兼容问题,代码量比较少,效率也高, 比较适合在微信使用。
jquery 大力提倡 dom操作,而 angula vue 这些都是抵制dom操作的,不建议有任何dom操作。
======里面讲到 路由设定,定义模板,常用方法
现在 web程序 都可以用js 写前后端了,node。js 就是运行在服务端的,不用写java代码 运行效率更高。
提到一个 JSOP viewer
// 定义组件
var Home = Vue.extend({
// template: '<img src="assets/img/home.png" alt="" width="100%">'
template: loadTemplate('home')
})
、、jsonp 跨域请求问题
var List = Vue.extend({
template: loadTemplate('list'),
data: function () {
// jsonp 取到api 提供的数据
this.$http.jsonp('http://localhost:2080/api/music')
.then(res => {
// console.log(res.data)
this.list = res.data
})
return {
list: []
}
},
methods: {
pad: pad,
convert: convertDuration
}
})
、
// 定义路由规则
// 每条路由规则应该映射到一个组件。这里的“组件”可以是一个使用 Vue.extend
// 创建的组件构造函数,也可以是一个组件选项对象。
// 稍后我们会讲解嵌套路由
router.map({
'/home': {
name: 'home',
component: Home
},
'/songs': {
name: 'list',
component: List
},
'/songs/:id': {
name: 'item',
component: Item
}
}) // 任意其他地址跳转到home
router.redirect({ '*': '/home' })
router
var audio = new Audio() 播放
audio.src = this.item.music
audio.play()







Vuejs---《Vue.js + Node.js-构建音乐播放器新玩法-video》的更多相关文章
- 使用 原生js 制作插件 (javaScript音乐播放器)
1.引用页面 index.html <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- 自定义css样式结合js控制audio做音乐播放器
最近工作需求需要播放预览一些音乐资源,所以自己写了个控制audio的音乐播放器. 实现的原理主要是通过js调整audio的对象属性及对象方法来进行控制: 1.通过play().pause()来控制音乐 ...
- 如何用vue打造一个移动端音乐播放器
写在前面 没错,这就是慕课网上的那个vue音乐播放器,后台是某音乐播放器的线上接口扒取,虽然这类项目写的人很多,但不得不说这还是个少有的适合vue提升的好项目,做这个项目除了想写一个比较大并且功能复杂 ...
- 基于vue的移动端web音乐播放器
声明 以下只是学习完慕课网huangyi老师实战视频课程的笔记内容,仅供个人参考学习使用.如果对Vue2.0实战高级-开发移动端音乐WebApp感兴趣的话,请移步这里:https://coding.i ...
- 原生JS实现音乐播放器!
前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...
- JS实现音乐播放器
JS实现音乐播放器 前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播 ...
- vue音乐播放器
利用vue写一个简单的音乐播放器,包括功能有歌曲搜索.歌曲播放.歌曲封面.歌曲评论.播放动画.mv播放六个功能. <template> <div class="wrap&q ...
- 10个免费开源的JS音乐播放器插件
点这里 音乐播放器在网页设计中有时候会用到,比如一些时尚类.音乐或影视类等项目,但这些 网页播放器 插件比较少见,所以这里为大家整理一个集合,也许会有用到的时候. 下面整理的播放器有些是支持自适应的, ...
- socket应用(vue、node.js、M站)
socket应用(vue.node.js.M站) 前言:我们在做一些项目的时候需要做到实时变化, 比如我们有时候有需求会要求我们做一个类似于聊天室的页面 比如有些时候我们对某些东西进行点赞和刷票,需要 ...
随机推荐
- (贪心部分背包问题)Saving HDU HDU2111
Saving HDU Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- PHP操作cookie
1.当只有一个参数的时候,默认是删除,响应报文里面设置了一个过去的时间 setcookie('key2'); 2.当有两个参数的时候,是设置cookie setcookie('key','value1 ...
- 关于 C# 中 Dictionary与Hashtable的性能测试
https://www.cnblogs.com/qianxingdewoniu/p/5266243.html
- 字符缓冲流BufferedWriter BufferedReader
//字符缓冲流主要用于文本数据的高速写入 package cn.lijun.demo1; import java.io.BufferedReader; import java.io.FileNotFo ...
- python: 基本知识(二)
1.set() set() 函数创建一个无序不重复元素集,可进行关系测试,删除重复数据,还可以计算交集.差集.并集等. x = set('hello’) y = set('world') x ---- ...
- 干货分享:互联网运营 学习SEO从零开始 SEO深度解析学习笔记
最近在自学SEO,互联网运营,把做的笔记干货分享给大家啊! 希望能帮到大家,如有好的建议可以关注我[磨人的小妖精]或留言,大家一起探讨. 之前还写过一篇文章互联网运营+SEO:推荐必看的5本书籍,学习 ...
- vmware centos7 网络配置
1. 在vmware创建centos虚拟机 2. 在cmd下看一下本机所处的网段,并对一下vmware上的配置 如果同样处于同一网段(192.168.aaa.bbb,aaa处一致就行),就可以直接开机 ...
- eclipse+tomcat+maven+springmvc+mybatis+mysql集成WebService插件(Axis2+CXF)
$1 环境介绍 $1.1 Eclipse Java EE IDE for Web Developers:Neon.2 Release (4.6.2) $1.2 Maven:3.3.9 $1.3 Spr ...
- mysql一张表多个字段关联另一张表查询
如下:一张订单表多个字段关联用户表: 1.链表查询 SELECT cu.id AS 'id',cu.version AS 'version',cu.cid AS 'cid',cu.uid AS 'ui ...
- React 记录(2)
入门教程:https://www.reactjscn.com/tutorial/tutorial.html 慢慢学习:对照教程文档,逐句猜解,截图 React官网:https://reactjs.or ...