当前位置:首页 > uni-app

uniapp手机存数据

2026-02-06 14:28:49uni-app

本地存储方式

uni.setStorage/uni.getStorage
适用于持久化存储少量数据(如用户登录状态、配置信息),数据以键值对形式保存在本地,关闭应用后仍存在。同步方法会阻塞线程,异步方法通过回调处理结果。

示例代码(异步存储)

uni.setStorage({
  key: 'token',
  data: 'abc123',
  success: () => console.log('存储成功')
});

示例代码(同步读取)

try {
  const value = uni.getStorageSync('token');
  console.log(value); // 输出 abc123
} catch (e) {
  console.error('读取失败');
}

临时存储方式

uni.setStorageSync/uni.getStorageSync
适合保存临时数据(如表单草稿),页面关闭后数据自动清除。同步方法直接返回操作结果,需用try-catch处理异常。

uniapp手机存数据

数据生命周期
仅当前小程序运行期间有效,重启后数据丢失。适用于页面间短时传递复杂对象。

文件系统存储

uni.saveFile/uni.getFileSystemManager
处理大型文件(如图片、音频),需先通过API下载或生成文件,再调用保存接口。文件路径为临时地址,长期保存需配合本地存储记录路径。

保存网络图片示例

uniapp手机存数据

uni.downloadFile({
  url: 'https://example.com/image.jpg',
  success: res => {
    uni.saveFile({
      tempFilePath: res.tempFilePath,
      success: savedRes => console.log(savedRes.savedFilePath)
    });
  }
});

SQLite数据库

plus.sqlite
App端专用,适合结构化数据高频读写(如聊天记录)。需创建数据库并执行SQL语句,支持事务处理。

初始化数据库示例

const db = plus.sqlite.openDatabase({
  name: 'mydb',
  path: '_doc/mydb.db'
});
db.executeSql('CREATE TABLE IF NOT EXISTS logs(id INTEGER PRIMARY KEY, content TEXT)');

注意事项

数据安全
敏感信息(如密码)避免直接存储,应加密后配合uni.removeStorage清除。App端使用SQLite时注意防止SQL注入。

平台差异
H5端存储有域名限制,iOS Webview存在5MB上限。App端可通过native.js扩展存储方案,如访问原生NSUserDefaults(iOS)或SharedPreferences(Android)。

标签: 数据手机
分享给朋友:

相关文章

h5实现手机摇一摇功能

h5实现手机摇一摇功能

实现原理 手机摇一摇功能基于设备加速度传感器(DeviceMotionEvent),通过监听设备的加速度变化来判断用户是否进行了摇晃动作。HTML5提供了相关API获取设备传感器数据。 基本…

vue数据实现

vue数据实现

Vue 数据实现的核心方法 Vue.js 通过数据驱动视图更新,其核心实现基于响应式系统。以下是实现数据绑定的关键方法: 数据声明与响应式原理 在 Vue 2.x 中,使用 Object.defin…

vue实现数据筛选

vue实现数据筛选

数据筛选的实现方式 在Vue中实现数据筛选可以通过计算属性、方法或第三方库完成。以下是几种常见的方法: 计算属性筛选 使用计算属性对数组数据进行筛选,具有缓存特性,适合静态或较少变化的数据。 co…

vue 实现数据滚动

vue 实现数据滚动

Vue 实现数据滚动的方法 在Vue中实现数据滚动可以通过多种方式完成,以下是几种常见的实现方法: 使用CSS动画实现滚动 通过CSS的animation和@keyframes可以实现简单的滚动效果…

vue实现手机震动

vue实现手机震动

Vue 中实现手机震动的方法 在 Vue 项目中可以通过调用浏览器的 Vibration API 实现手机震动功能。以下是具体实现方式: 检测浏览器支持性 在调用震动功能前需检查浏览器是否支持该 A…

vue如何实现数据

vue如何实现数据

Vue 数据实现方式 Vue 提供了多种方式实现数据管理和响应式更新,核心机制基于响应式系统和状态管理方案。 响应式数据声明 在组件选项中使用 data 函数返回对象,Vue 会自动递归转换属性为响…