Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/shaobeichen/lvyou
:school_satchel:Vue.js 初步进阶案例，路由懒加载，进入页面前登录判断，返回导航判断，RestAPI接口使用，组件封装，Vuex状态封装，keep-alive页面缓存等功能
https://github.com/shaobeichen/lvyou
leancloud muse-ui vue vue-awesome-swiper vue-cli vue-lazyload vue-resource vue-router vuejs vuejs2 vuex
Last synced: 13 days ago
JSON representation
:school_satchel:Vue.js 初步进阶案例，路由懒加载，进入页面前登录判断，返回导航判断，RestAPI接口使用，组件封装，Vuex状态封装，keep-alive页面缓存等功能
- Host: GitHub
- URL: https://github.com/shaobeichen/lvyou
- Owner: shaobeichen
- License: mit
- Archived: true
- Created: 2017-03-06T13:00:33.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-05-24T01:32:07.000Z (over 5 years ago)
- Last Synced: 2024-10-11T03:16:08.301Z (about 1 month ago)
- Topics: leancloud, muse-ui, vue, vue-awesome-swiper, vue-cli, vue-lazyload, vue-resource, vue-router, vuejs, vuejs2, vuex
- Language: Vue
- Homepage:
- Size: 2.46 MB
- Stars: 195
- Watchers: 17
- Forks: 47
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Lvyou (现由于leancloud问题，无法查看线上demo)
[](#backers) [](#sponsors)     
> 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](https://github.com/zhou1178539345/lvyou/pulls)。
### 目录结构
```
├─ 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](https://opencollective.com/lvyou#backer)]
## Sponsors
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/lvyou#sponsor)]
