vue音乐播放器论文答辩

模仿 QQ 音乐网页版界面，采用 flexbox 和 position 布局

仓库名称 ：Vue-mmPlayer

标星(star) ：818 （新进项目，趋势不错哦，潜力股项目）

标星趋势

拷贝(fork) ：229

贡献人数 ：1 （一枝独秀，独孤求败，也许有你的加入，项目可以走得更远）

仓库大小 ：16 MB

主要开发语言：Vue

语言分布：Vue:、JavaScript:、HTML:、CSS:

代码提交周期分布 ：

2星

mmPlayer （）启动 版本

展开查看

PC端界面自我感觉还行， 就是移动端界面总觉得怪怪的，奈何审美有限，所以又去整了高仿网易云的 React 版本（如果小哥哥、小姐姐们有好看的界面，欢迎交流哈）

PC

正在播放

排行榜

搜索

我的歌单

我听过的

歌曲评论

移动端

程序员新视界：分享有趣、有料的程序员话题，每天进步一点点。

话说最近一直在攻在网上花二十块大洋买的vue音乐播放器项目，收获颇多！对vue项目整体的流程有了更进一步的了解，打算花点空余时间把这个项目再撸几遍，然后转入京东的项目实战中。。。         实际工作中一直涉及的是数据可视化操作（Echarts、Highcharts），即大量数据图表展示，却独独没有用到丁点儿的vue知识，感觉实在是让人憋得心慌，晚上没事干脆试验一把，如题：在Vue项目中实现数据可视化操作 Echarts  步骤： 一、安装插件         cnpm install echarts -D 注：echarts 也不能通过 () 进行全局调用 所以，通常在需要使用图表的 .vue文件中直接引入 import echarts from 'echarts' 也可以在中引入，然后修改原型链 .$echarts = echarts 这样在全局中就可以直接使用了 let mychart = this.$(('mychart')) 二、创建图表         由于一般情况我们会在组件中使用，这里我也贴近实际开发，举的例子就是应用于组件中 数据导入 这样图表就可以在页面中展示出来了 问题：这里引入的 echarts 包含了所有图表，但有时候我们只需要一两个基本图表，这时候完整的 echarts 就显得累赘，所以： 二、按需引入     // 引入基本模板letecharts = require('echarts/lib/echarts')   // 引入饼图组件require('echarts/lib/chart/pie')   // 引入提示框和图例组件require('echarts/lib/component/tooltip')   require('echarts/lib/component/legend') 可以按需引入的模块列表见 继续引出问题：在echarts中图表宽高如果不写，那么就相当于作死，所以nozuonodie，所以： 三、适应容器 let chartBox = ('charts')[0] let myChart = ('myChart') // 用于使chart自适应高度和宽度,通过窗体高宽计算容器高宽 function resizeCharts () {   = + 'px'   = + 'px' } // 设置容器高宽 resizeCharts() let mainChart = (myChart) (options) 四、扩展 可以把这个案例模块化，设计成一个可复用组件，只需传入id、options既可完成图表渲染 参考案例： 刚好，参考案例中用的是highcharts