Flutter Web持久化存储SharedPreferences原理

前言

在Flutter中,类似于Android,SharedPreferences 是一种用于持久化存储键值对数据的机制


实现原理

对于移动平台(如Android和iOS),SharedPreferences 利用了各自平台的持久化存储能力。在Android上,它使用轻量级的Key-Value存储系统,在iOS上,使用UserDefaults

对于Web平台,SharedPreferences 的实现有所不同,因为Web平台没有与Android或iOS相同的持久化存储机制。在Web上,SharedPreferences 的实现是基于浏览器的 localStorage 功能

注意要点

  1. localStorage:Web浏览器提供的一个持久化存储机制,允许网站存储键值对数据。它与会话存储(sessionStorage)类似,但它的数据在浏览器关闭后仍然保留

  2. 键值对存储:和移动平台上的实现一样,SharedPreferences 在Web上也是通过键值对来存储数据的。但在Web端,这些数据被保存在浏览器的 localStorage

  3. 数据持久化:使用 localStorage,数据会在用户的浏览器中持久化存储,即使关闭和重新打开浏览器,这些数据也会保留

  4. 限制:由于它是基于浏览器的,localStorage 有一些限制,如存储容量限制(通常为5MB左右),并且只能存储字符串。因此,对于非字符串类型的数据,SharedPreferences 需要将其序列化为字符串,然后再进行存储


附言

需要注意的是,用户可以通过清除游览器数据来删除localStorage中的数据

  • 15
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Flutter提供了多种持久化存储数据的方法,包括: 1. Shared Preferences:用于存储键值对,适合存储简单的数据,如用户设置、应用程序配置等。 2. SQLite数据库:用于存储结构化数据,适合存储大量数据和复杂数据,如用户信息、应用程序数据等。 3. 文件存储:用于存储大型二进制数据,如图像、音频、视频等。 下面是使用Shared Preferences进行数据持久化的示例代码: ```dart import 'package:flutter/material.dart'; import 'package:shared_preferences/shared_preferences.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', home: MyHomePage(), ); } } class MyHomePage extends StatefulWidget { @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { String _name = ''; @override void initState() { super.initState(); _loadName(); } void _loadName() async { SharedPreferences prefs = await SharedPreferences.getInstance(); setState(() { _name = prefs.getString('name') ?? ''; }); } void _saveName(String name) async { SharedPreferences prefs = await SharedPreferences.getInstance(); await prefs.setString('name', name); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Flutter Demo'), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Text( 'Hello, $_name!', style: Theme.of(context).textTheme.headline4, ), TextField( onChanged: (value) => _saveName(value), ), ], ), ), ); } } ``` 在这个示例中,我们使用SharedPreferences存储用户的名字。在初始化时,我们会调用_loadName()方法来加载存储SharedPreferences中的名字。在用户输入名字后,我们会调用_saveName()方法来保存名字。每当名字发生变化时,UI会自动更新。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

夏目艾拉

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值