具体的操作流程(实现步骤):
1.歌曲搜索
2.歌曲播放
3.歌曲评论
4.播放歌曲的MV(有的歌曲没有MV)
代码编写过程:
1.创建一个Vue项目(前提是安装好了node.js、npm、vue)
使用npm install命令,安装命令:npm install -g @vue/cli
vue create 项目的名称(最好是全英文)
具体的配置如下:
在工程化的项目中:通过main.js把App.vue渲染到index.html的指定区域中。
其中:
1)App.vue用来编写带渲染的模板结构
2)index.html中需要预留一个el区域(el即对应的HTML中的div的id或者class名称)
3)main.js把App.vue渲染到index.html所预留的区域中
2.导入需要的css文件、js文件、图片等
3.编写对应的代码
assets文件夹,存放项目中用到的静态文件,例如:CSS样式表,图片资源
components文件夹,程序员封装的,可复用的组件,都要放到components文件下
main.js是项目的入口文件,整个项目的运行,要先执行main.js
App.vue是项目的根组件(刚进入网站见到的页面/首页相当于index.html)
4.运行项目
先切换到当前这个项目的目录下,之后使用命令:npm run serve命令运行项目
注意:在开发阶段 run serve 上线阶段 run build
5.效果展示:(搜索:张杰的歌为例)
如果需要源码,关注后评论or私聊~(●'◡'●)