Vue2.0简易案例

sourcenode 发布于2019-08-20 13:52 / 3223人阅读

摘要：由于众所周知的原因，谷歌字体只能过墙后才能被正常加载，而中的原生使用了谷歌字体，在这个案例中改为使用。代码存在，国内访问速度没那么快，初次加载较慢请耐心等待。如果项目对你有所帮助，不妨一下，你的支持是我前进的最大动力。

效果图：

使用微信或手机浏览器扫描二维码预览

在线地址： https://www.huzerui.com/vue2.0-demo

源码：https://github.com/alex1504/vue2.0-demo

说明：

2017.1.13 主导航电影、音乐、图书、图片使用router跳转电影模块使用tab菜单切换各个列表模块下拉滚动加载图片模块使用flex布局实现瀑布流效果
2017.1.17 增加了电影详情模块，优化路由跳转
2017.1.18 增加了登录、登出模块，使用leancloud数据存储功能
2017.1.19 增加了图片详情模块，增加了新的生产依赖vue-touch
2017.2.6 新增用户注册模块

使用vue-cli构建 生产环境依赖包：

"axios": "^0.15.3",  //发送请求   
 "vue": "^2.1.0",     
"vue-material": "^0.5.2", //谷歌material概念的Ui框架   
 "vue-router": "^2.1.1",   //路由   
 "vue-swipe": "^2.0.2",   //slide插件   
 "vuex": "^2.1.1"            // 状态管理   
 "vue-touch": "^2.0.0-beta.3",  //触摸插件

开发依赖

"babel-core": "^6.0.0",
"babel-loader": "^6.0.0",
"babel-preset-es2015": "^6.0.0",
"cross-env": "^3.0.0",
"css-loader": "^0.25.0",
"file-loader": "^0.9.0",
"mockjs": "^1.0.1-beta3",
"node-sass": "^4.2.0",
"sass": "^0.5.0",
"sass-loader": "^4.0.0",
"style-loader": "^0.13.1",
"vue-loader": "^10.0.0",
"vue-style-loader": "^1.0.0",
"vue-template-compiler": "^2.1.0",
"webpack": "^2.1.0-beta.25",
"webpack-dev-server": "^2.1.0-beta.9"

使用了几个开放的接口

各个接口地址请在components中各个list组件的loadMore方法中查看

豆瓣- 电影图书 （注意：豆瓣的接口有每分钟40次的限制，超过调用貌似会冻结几分钟，所以电影模块和图书模块有时候会出现没有东西的情况）

网易- 音乐列表音乐搜索

gankio- 福利图

其他说明：

Vue-material组件中的spinner（加载组件）在安卓机下面的浏览器有些无法正常显示（除了chrome），ios下面测试正常，微信中体验效果较好。

由于众所周知的原因，谷歌字体只能过墙后才能被正常加载，而Vue-material中的原生icon使用了谷歌字体，在这个案例中改为使用iconfont。

代码存在github，国内访问速度没那么快，初次加载较慢请耐心等待。

如果项目对你有所帮助，不妨star一下，你的支持是我前进的最大动力。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/81287.html

关于Vue2一些值得推荐的文章 -- 五、六月份

摘要：五六月份推荐集合查看最新的请点击集前端最近很火的框架资源定时更新，欢迎一下。苏幕遮燎沈香宋周邦彦燎沈香，消溽暑。鸟雀呼晴，侵晓窥檐语。叶上初阳乾宿雨，水面清圆，一一风荷举。家住吴门，久作长安旅。五月渔郎相忆否。小楫轻舟，梦入芙蓉浦。五、六月份推荐集合查看github最新的Vue weekly；请::点击::集web前端最近很火的vue2框架资源；定时更新，欢迎 Star 一下。苏...

sutaking 2019-08-02 15:17 评论0 收藏0
关于Vue2一些值得推荐的文章 -- 五、六月份

摘要：五六月份推荐集合查看最新的请点击集前端最近很火的框架资源定时更新，欢迎一下。苏幕遮燎沈香宋周邦彦燎沈香，消溽暑。鸟雀呼晴，侵晓窥檐语。叶上初阳乾宿雨，水面清圆，一一风荷举。家住吴门，久作长安旅。五月渔郎相忆否。小楫轻舟，梦入芙蓉浦。五、六月份推荐集合查看github最新的Vue weekly；请::点击::集web前端最近很火的vue2框架资源；定时更新，欢迎 Star 一下。苏...

khs1994 2019-08-23 18:08 评论0 收藏0
Vue 笔记三：Vue2.0与1.0的区别

摘要：升级的区别与的断层式升级不同，延续了自己的风格。在命名方式和上有一些区别，掌握它们是你升级整个项目的关键。以下内容都是来源于个人项目的一些经验之谈，并非系统性的阐述。总目录前端经验收集器转载自个人建了前端学习群，旨在一起学习前端。升级的区别与angular的断层式升级不同，vue延续了自己的风格。在命名方式和API上有一些区别，掌握它们是你升级整个项目的关键。以下内容都是来源于个人...

Big_fat_cat 2019-08-21 11:35 评论0 收藏0