lvyou

:school_satchel:Vue.js 初步进阶案例,路由懒加载,进入页面前登录判断,返回导航判断,RestAPI接口使用,组件封装,Vuex状态封装,keep-alive页面缓存等功能

Github stars Tracking Chart

Lvyou (现由于leancloud问题,无法查看线上demo)

Backers on Open Collective Sponsors on Open Collective npm npm npm npm npm

Vue.js 初步进阶案例,适合vue入门者进阶

路由懒加载,进入页面前登录判断,返回导航判断,RestAPI接口使用,组件封装,Vuex状态封装,keep-alive页面缓存等

旅游APP,为喜欢旅游的人专业提供旅游攻略,致力提升旅游体验。

目前功能不全,后期会慢慢完善,诸多问题,还望各位见谅。

项目技术架构

  • vue
  • vue-router
  • vuex
  • vue-resource
  • vue-cli
  • less
  • webpack
  • muse-ui
  • vue-awesome-swiper
  • vue-lazyload
  • leancloud

安装部署

1.下载

git clone https://github.com/LeachZhou/lvyou.git

2.进入项目

cd lvyou

3.安装依赖

npm install

4.运行

npm run dev

5.打包

npm run build

功能

  • 首页
  • 发现详情页
  • 双列详情页
  • 话题页
  • 话题发布页
  • 干货页
  • 排行榜页
  • 干货详情页
  • 搜索页
  • 侧滑栏
  • 登录注册页
  • 用户页
  • 反馈信息页
  • 咨询客服
  • 注销
  • 图片懒加载
  • banner切换

友情告知:后台数据采用leancloud RestAPI,因本人能力有限,一些请求未能请求成功,如果有人能够解决问题,欢迎随时pull request

目录结构

├─ build                                   // webpack配置文件
├─ config                                  // 项目设置
├─ docs                                    // 项目部署文件
├─ src
│  ├─ assets                               // 静态文件
│  │  ├─ css                               // 公共css
│  │  └─ image                             // 图片文件
│  ├─ components                           // 页面
│  │  ├─ public                            // 公共组件
│  │  │  ├─ addButton.vue                  // 话题页发布评论按钮组件
│  │  │  ├─ backBar.vue                    // 返回顶部栏组件
│  │  │  ├─ list.vue                       // 列表组件
│  │  │  ├─ publicFooter.vue               // 底部导航栏
│  │  │  ├─ publicHeader.vue               // 头部导航栏
│  │  │  ├─ publicTitle.vue                // 公共标题栏
│  │  │  ├─ spinner.vue                    // 加载组件
│  │  │  ├─ swiper.vue                     // 首页banner组件
│  │  │  └─ topicBanner.vue                // 话题banner组件
│  │  ├─ detailPage.vue                    // 首页详情页
│  │  ├─ editPage.vue                      // 发布评论页
│  │  ├─ feedBack.vue                      // 反馈页
│  │  ├─ goods.vue                         // 干货页
│  │  ├─ goodsCharts.vue                   // 排行榜页
│  │  ├─ goodsDetailPage.vue               // 干货详情页
│  │  ├─ index.vue                         // 首页
│  │  ├─ indexFourFour.vue                 // 首页双列详情页4
│  │  ├─ indexFourOne.vue                  // 首页双列详情页1
│  │  ├─ indexFourThree.vue                // 首页双列详情页3
│  │  ├─ indexFourTwo.vue                  // 首页双列详情页2
│  │  ├─ login.vue                         // 登录页
│  │  ├─ search.vue                        // 搜索页
│  │  ├─ test.vue                          // 测试页(备用)
│  │  ├─ topic.vue                         // 话题页
│  │  └─ user.vue                          // 用户页
│  ├─ router
│  │  └─ index.js                          //路由配置
│  ├─ vuex
│  │  └─ store.js                          // vuex配置
│  ├─ App.vue                              // 页面入口文件
│  └─ main.js                              // 程序入口文件
├─ static                                  // 静态文件
├─ .babelrc                                // ES6语法编译配置
├─ .editorconfig                           // 代码编写规格配置
├─ .gitignore                              // git 忽略项
├─ .postcssrc.js
├─ LICENSE                                 // 许可证
├─ README.md                               // README
├─ index.html                              // html模板
└─ package.json                            // 配置依赖

运行效果

这里写图片描述

这里写图片描述

这里写图片描述

APP

软件下载地址
软件使用HBuilder进行应用打包,另外制作了启动页和appIcon

这里写图片描述

鸣谢

  • Vue
  • Muse-UI
  • leancloud
  • vue-awesome-swiper
  • vue-lazyload
  • HBuilder

END

这是本人深入vue系统所制作的一个webapp,由于接口使用的是leancloud,很多功能没有实现,后期想用node.js自己写RestAPI,再完善组件和界面。欢迎大家STAR!

Contributors

This project exists thanks to all the people who contribute.

Backers

Thank you to all our backers! ? [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]










Main metrics

Overview
Name With Ownershaobeichen/lvyou
Primary LanguageVue
Program languageJavaScript (Language Count: 4)
Platform
License:MIT License
所有者活动
Created At2017-03-06 13:00:33
Pushed At2019-05-24 01:32:07
Last Commit At2019-05-24 09:32:06
Release Count0
用户参与
Stargazers Count193
Watchers Count16
Fork Count47
Commits Count100
Has Issues Enabled
Issues Count3
Issue Open Count0
Pull Requests Count1
Pull Requests Open Count0
Pull Requests Close Count0
项目设置
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private