uni-app学习心得

一、简介

1、前言

uni-app 是一个使用 vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。

2、主要优点：

2.1、开发效率高：uni-app 是一款跨平台的应用开发框架，可以使用一套代码，同时发布到iOS、Android、H5、小程序等多个平台，大大提高了开发效率。

2.2、功能强大：uni-app 提供了丰富的组件和API，可以满足开发者的大部分需求，可以快速实现复杂的功能。

2.3、 体验优秀：uni-app 可以实现原生应用的体验，可以满足用户的使用需求。

二、uni-app框架目录基本概念

1、一般目录结构如下：

1. /.hbuilderx     (系统目录)
2. /.vite    (系统目录)
3.  /node_modules (系统目录，存储平台插件)
4. /pages (系统目录，存储页面文件，比如vue、nvue)
5. /uni_modules (系统目录，存储组件插件)
6. /unpackage  (系统目录，存储打包文件)
7. /components  (系统目录，非必需存在。可以删除。用于存储自定义组件)
8. /hybrid  (系统目录，非必需存在。可以删除。App端存放本地html文件的目录)
9. /platforms  (系统目录，非必需存在。可以删除。存放不同平台的文件)
10. /static (系统目录，目录下的文件均会被完整打包进去，且不会编译)
11. /common (个人创建目录，存储通用文件，比如JS文件、CSS文件)
12. /directive (个人创建目录，存储所有自定义指令文件夹)
13. /store (个人创建目录，存储共享数据模块)
14. /utils (个人创建目录，存储工具类模块)

• 

三、数据缓存 

1、常用的数据缓存API

1. uni.setStorage(OBJECT)    将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。
2. uni.setStorageSync(KEY,DATA)    将 data 存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个同步接口。
3. uni.getStorage(OBJECT)    从本地缓存中异步获取指定 key 对应的内容。
4. uni.getStorageSync(KEY)    从本地缓存中同步获取指定 key 对应的内容。
5. uni.getStorageInfo(OBJECT)    异步获取当前 storage 的相关信息。
6. uni.getStorageInfoSync()    同步获取当前 storage 的相关信息。
7. uni.removeStorage(OBJECT)    从本地缓存中异步移除指定 key。
8. uni.removeStorageSync(KEY)    从本地缓存中同步移除指定 key。
9. uni.clearStorage()    清理本地数据缓存。
10. uni.clearStorageSync()    同步清理本地数据缓存。

四、总结

通过学习Uni-app，我深刻体会到了跨平台开发的便利性和潜力。Uni-app的强大功能和丰富资源为开发者提供了广阔的空间，让我们能够更加灵活地应对不同平台的需求。我非常庆幸能够学习和掌握这门课程，它为我的技术栈增添了一抹亮色。未来，我将继续深入研究Uni-app，不断提升自己的技能水平，并将所学应用到实际项目中，为用户提供更好的应用体验。

总而言之，Uni-app的学习之旅是一次富有收获和乐趣的经历。我相信，随着移动应用行业的不断发展，跨平台开发将成为趋势，而Uni-app将成为我不可或缺的工具之一。我骄傲地走在前端开发的路上，期待在这片广阔的领域中不断探索和创造。