关于对现阶段vue项目的一些总结和感想
一、前言
现阶段手上vue的项目差不多快完了,空闲之余回反复对整个项目的代码结构、实现细节以及框架上的做了一些思考和优化。下面打算把想到的和重点实现的方法记录一下。
二、回顾
对于常规操作,这里不做过多的阐述,我们只讨论重点部分
1.登录模块:这块我们用了两个校验,一个是权限校验一个是账号校验。第一个校验通过之后执行第二个校验,两者通过登录成功,页面跳转。
a.这里网络请求用的是axios,它是基于promise封装的一个http库,所以用了两个.then()的链式写法,当然也支持多个链式操作。第一个then方法是权限校验,第二个then方法是账号登录校验。如果是以前的ajax的话,这里就需要在success方法里面写回掉了(又称回调金字塔);this.root是一个全局变量,这个后面在做解释。
b.账号校验成功之后将个人信息存到vuex中,主要包括state,actions和mutations,state定义数据格式,view与actions交互,actions调用mutations定义的方法,mutations在改变state中的数据
2.路由:使用动态路由和全局守卫,路由动态加载,router.beforeEach进行页面拦截。具体请参考https://www.cnblogs.com/xufeikko/p/10169826.html
a.获取动态路由,push,addRoutes
b.全局守卫:根据登录成功后state中的doctorId判断
3.全局变量root(正式环境和开发环境的路径)
区分正式环境和开发环境,需要在config文件中的dev.env.js和prod.env.js文件中做相应的配置
a.dev.env.js配置,这里配置开发环境地址
b.prod.env.js配置,这里配置正式环境地址
c.全局变量的使用
4.全局组件的注册和在main.js中的引用,另外还有一个局部组件,两者需配合一起使用。
5.axios的拦截封装:对各response的status进行判断拦截,然后做出对应的动作.
6.利用scss实现整体换肤和字体大小的设置,具体实现请参考 https://www.cnblogs.com/xufeikko/p/10060676.html
7.使用vue+dcloud的h5+API实现调用底层摄像头、拍照上传及其它一些原生功能,需用hbuilder打包后才可以调试。
a.调用摄像头或相册选取图片
b.创建任务、添加文件、开始上传任务
8.使用腾讯云Im(websdk)实现即时通信 具体可以参考:https://www.cnblogs.com/xufeikko/p/10222292.html 及腾讯官方文档 https://cloud.tencent.com/document/product/269
三、感想
最近利用空闲时间对整体项目的框架和内部代码重新过了一遍,通过对比了其它的项目结构和具体的各技术实现方案,确实看到了以往在专注开发过程所没注意到的东西,有宏观的、微关的。尽管目前项目并不是很最好的状态,但通过此次的思考让我对整个项目有了重新的认识,也让自己前进了一小步。该项目使用了vue+Dcloud两种框架,dcloud主要使用了其所提供的api实现一些原生的功能。本篇文章由于没有具体介绍实施的细节,只想做一些项目上大的方向上的交流。如果大家有什么的好的想法和建议,欢迎留言一起学习和交流。文章中如有不足之处,也希望各位大佬给与指正,谢谢。
最新文章
- Linux下连接MSSQL之安装FreeTDS
- TestNg依赖高级用法之强制依赖与顺序依赖------TestNg依赖详解(二)
- js毫秒数转换成时间格式
- 【SSH之旅】一步学习的步Struts1相框(三):分析控制Struts1示例
- python13_day4
- K:正则表达式之基础简介
- hbuilder ios 打包失败,无法导入p12证书的解决方案
- codeforces 842C Ilya And The Tree
- Node.js(day5)
- .NET应用程序管理服务AMS设计
- python 全栈开发笔记 4
- oracle-taf
- MySQL+Amoeba实现数据库读写分离
- 初等数论及其应用 (第6版) (Kenneth H.Rosen 著)
- Loadrunner使用键盘快捷键
- [转]Linux 命令行快捷键
- 教你如何禁用U盘、屏蔽USB端口的三种方法
- 1.phpcms的安装和卸载文件
- 转:好用 Eclipse插件收集与说明
- Access2013 Mssql2012 数据库连接字符串