uniapp数据存储在本地，获取和移除。

最新推荐文章于 2025-10-24 16:48:14 发布

原创最新推荐文章于 2025-10-24 16:48:14 发布 · 1.5w 阅读

36 ·

CC 4.0 BY-SA版权

文章标签：

#前端

本文详细介绍了uniapp中数据的本地存储、获取和移除操作，包括异步和同步两种方式。推荐使用同步方法，如uni.setStorageSync和uni.getStorageSync，它们提供了更直接的数据存取体验。示例代码展示了如何进行数据的存储、读取和删除，便于开发者理解和应用。

uniapp数据存储在本地，获取和移除，两种方法，异步和同步，推荐使用同步
html代码

<template>
	<view>
		<button type="default" @click="setStorage">数据缓存到本地</button>
		<button type="primary" @click="getStorage">获取数据</button>
		<button type="warn" @click="removeStorage">移除数据</button>
	</view>
</template>

数据存储异步

//缓存数据
setStorage(){
	//这是一个异步接口
	uni.setStorage({
		key: 'id',//本地缓存中的指定的 key
		data: 80//需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象
	}) 
},

数据存储同步

//缓存数据
setStorage(){
	//这是一个同步接口。建议使用这个方法
	//第一个参数本地缓存中的指定的 key
	//第二个参数需要存储的内容
	uni.setStorageSync('id',100);
},

在这里插入图片描述

获取数据异步

getStorage(){
	//这是一个异步接口
	uni.getStorage({
		key:'id',//本地缓存中的指定的 key
		success(res) {//接口调用的回调函数，res = {data: key对应的内容}
			console.log(res.data)
		}
	})
},

获取数据同步

getStorage(){
	//这是一个同步接口。建议使用这个方法
	//参数本地缓存中的指定的 key通过赋值给一个变量获取
	const value = uni.getStorageSync('id');
	console.log(value);
},

在这里插入图片描述

数据移除异步

removeStorage(){
	//这是一个异步接口 
	uni.removeStorage({
		key: 'id',//本地缓存中的指定的 key
		success(res) {//接口调用的回调函数
			console.log('移除成功');
		}
	})
}

数据移除同步

removeStorage(){
	//这是一个同步接口。建议使用这个方法
	//参数本地缓存中的指定的 key通过赋值给一个变量获取
	const value = uni.removeStorageSync("id");
	console.log("移除成功");
}

id从本地缓存移除
在这里插入图片描述