今年是vue比较火的一年，自己也在闲暇之余，用vue全家桶+vuxui框架，写了一个简单的app应用，首先来看下效果吧（ps:数据来自掘金）
以上就是基本效果图，项目中用了
vue-router => 路由axios => ajax请求方式vuex => 状态管理(ps:由于项目比较小，也就没有具体是用vuex，只是将数据存储到本地，来展示在页面，本质和vuex做到同样的效果)vux => ui框架（ps：个人认为vux不适合新手使用，使用困难难度较大，建议使用比较简单的ui框架，如：vue-ydui，mint-ui...）vue-cli2.x ps:虽然vue3.0脚手架出来了，但是没有具体文档，webpack方面也需要自己配置，上手比较困难，建议使用vue2.x版本脚手架复制代码
首先
vue init webpack 项目名称复制代码
第二步
写好需要用到的文件夹及路由复制代码
为什么要自己封装一个弹窗插件，因为vux我也是才用，当时看的一脸懵逼，所以就自己封装了一个简单的弹窗插件...
代码中并没有什么难点，也没有很多的骚操作，仅仅适用于刚刚接触vue的人，代码中不正确的地方，还请各位大佬纠正
首先，一听到封装插件，一般人就觉得好难，其实并不是那么难，由于本人技术有限，所以就用原生封装的插件(ps:如果各位大佬有好的方法，情赐教)
下一步 => 将一些常用的函数封装，以便使用，在这里我只封装了验证手机号，邮箱和密码(密码和没封装差不多，喜欢的朋友可以自己尝试一下)
这里引入vue只是为了使用挂载在vue原型上的弹窗插件，当然也可以引入上面的diLog.js 使用里面的方法，但是既然挂载在了vue原型上，那我们就物尽其用吧import Vue from 'vue' => 引入vue，使用vue原型上方法Vue.prototype.$diaLog.errFunctio() => 使用挂载在vue原型上的函数复制代码
登陆页面和游戏页面使用了简单的css3动画，有兴趣的可以自己尝试一下https://www.djsminiaturegoLf.com
没有ui有些页面比较丑陋，还请见谅，本人手写了一些简单下啦刷新，上啦加载等操作，下面
看下代码
此项目充分使用了组件复用，登陆，注册找回密码公用一个组件
首页和发现页公用一个组件，
看起来会比较乱，但是避免了代码冗杂
项目中使用了路由，组件懒加载
eg:
// 游戏 路由懒加载 { path: '/playGame', name: 'playGame', component: resolve => require(['@/page/playGame/playGame'], resolve), meta: { isShow: false } },//组件懒加载components: { findList: resolve => require(["./components/findList"], resolve) },//这里使用懒加载只是做个示例，用于代码打包后首屏加载速度复制代码以上就是全部代码，稍后上传github供大家参考
想要一起学习的可以在下方留言，欢迎各位大佬指点纠正
end.
转载于:https://juejin.im/post/5c4db71af265da616c65f4cc
随时随地看视频
