项目介绍:对以往版本全新升级,是一个基于 Vue 3 和 TSX 搭建的、完整可用、数据存储在云端的移动端记账项目。技术栈采用了Vue3 + TSX,采用CSS Modules方案、使用JWT 实现用户认证。主要页面有:欢迎广告页、主页列表、记账页、标签页、统计页、登录页以及菜单栏
技术要点:
对Axios请求的二次封装、设置请求头信息,拦截器(设置统一loading,统一处理错误信息)等
手写vite插件实现 SVG Sprites 性能优化
使用路由守卫进行统一权限判断
手动封装表单验证组件,提升拓展性
使用 Pinia、storage 实现对数据持久化进行状态管理
利用 Date 对象二次封装 time 库,提升功能使用性
手动封装常用通用组件和业务组件
使用 Echarts 对数据进行可视化展示,二次封装 Echart 对可视化组件进行统一管理
通过查阅文档和实例,实现了两种数据可视化形式,折线图和饼图,熟悉了可视化模块的使用
配置 mock 参数,提升开发效率
技术体系:Vue 3、Vite 3、TSX、Vue Router 4、Pinia、JWT 等