码迷,mamicode.com
首页 > Web开发 > 详细

vue项目实战-pc端新闻网页

时间:2020-07-20 15:50:35      阅读:169      评论:0      收藏:0      [点我收藏+]

标签:实战   lex   vue-cli   使用   处理   定义   tps   new   com   

1、项目初始

基于vue-cli搭建项目

vue create news-app

页面采用flex布局、样式使用sass

2、首页的搭建

主要包括导航栏,轮播图,及主要新闻的展示

技术图片

 

 

 

2、点击导航栏可进行不同新闻的切换 通过id的不同获得不同的数据,进行页面渲染,每个页面只展示5条数据,对页面进行分页,点击不同的页码切换不同的数据。

技术图片

 

 

3、登录和注册页面

 

 页面是否登录、以及登录后的个人信息,属于页面共享,定义在store中

 

技术图片

 

 

对注册页面和登录页面进行处理

 

技术图片

 

 

 

 

 4、个人中心页面进行授权处理

技术图片

 

vue项目实战-pc端新闻网页

标签:实战   lex   vue-cli   使用   处理   定义   tps   new   com   

原文地址:https://www.cnblogs.com/hylcode/p/13344783.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!