![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 79
qq_40063133
这个作者很懒,什么都没留下…
展开
-
vue-cli从零开始实现一个仿豆瓣app(一)
最近利用vue+nodejs+mysql实现了一个简单的仿豆瓣网站,记录一下实现的过程。先放上github地址:https://github.com/jaminejiang/douban.git首先是搭建框架。项目需要安装的是node和git,这里不详细讲快速搭建vue-cli可以按照官网的步骤:点击打开链接# 全局安装 vue-cli$ npm install --global vue-cli#...原创 2018-02-28 18:16:38 · 3921 阅读 · 3 评论 -
vue-cli从零开始实现一个仿豆瓣app(二)
接着上文,接下来就是实现首页的功能了。首页的功能是展现最新的片子等等。主要有顶部搜索框,中间主体部分又分为电影、电视剧、综艺、书籍四类,每一类都是复用同一个组件来实现图片轮播功能。首页每个类别只展现最新的5部影片,其中显示在浏览器上的有三部,可通过按钮左右切换来查看其他两部影片。先讲一下轮播图实现。说一下考虑到总共四个类别会在屏幕上,如果设置自动定时切换会看的人眼花缭乱所以我就没有设置定时切换而是...原创 2018-03-03 20:48:22 · 830 阅读 · 0 评论 -
vue-cli从零开始实现一个仿豆瓣app(三)
话说昨天说完首页了,那今天就来说一下列表页。列表页其实很简单,主要就是在首页点击某个类别的按钮就跳转到该列表页,展现该类别的所有影片简介。很显然,四个类别是可以利用同一个组件的,只是渲染的数据有所不同。我们要做的就是根据在首页点击的按钮传入不同的参数,比如1,2,3,4分别代表四个类别,而在列表页就获取这个参数并向服务器请求该类别的数据。我们在前面做轮播组件的时候给组件绑定了一个跳转事件: ...原创 2018-03-04 11:31:59 · 578 阅读 · 0 评论 -
vue-cli从零开始实现一个仿豆瓣app(四)
最后一页是详细页,详细页的小功能比之前的要多。首先是对影片内容的展示,包括头部的图片,中间的影片信息和评分情况。比较值得说的就是展示评分信息模块。这个模块从数据库中查询某一影片的评分情况,做一下简单统计各星级的评分人数并计算出比例,然后用div的宽度表示比例。//获取该影片的评价情况,首先获取分数和评分人数,然后获取各个分数段的评分人数 this.$axios.post('/api...原创 2018-03-06 10:28:16 · 496 阅读 · 0 评论 -
vue-cli从零开始实现一个仿豆瓣app(五)
终于写到最后一篇了。最后讲一下如何展示热门评论和最新评论,原理很简单就是分别用不同的sql语句查询,一个用order by desc limit,一个直接查询就行啦。就是这两句啦。query_hot_comment:'select user.username,usercomment.* from user,usercomment where user.userid = usercomment.us...原创 2018-03-06 10:57:52 · 891 阅读 · 0 评论