Flutter中如何从SharedPreferences设置全局变量并跨页面使用？

一、基于SharedPreferences实现全局可访问的用户数据 #

你可以把SharedPreferences封装成单例类，提前初始化后就能在任意页面直接访问属性，不用每次异步获取。

1. 封装单例类 #

创建MySharedPreferences类，用单例模式保证全局唯一实例，同时封装username和job的 getter 方法：

import 'package:shared_preferences/shared_preferences.dart';

class MySharedPreferences {
  // 单例实例
  static final MySharedPreferences _instance = MySharedPreferences._internal();
  late SharedPreferences _prefs;

  // 工厂构造函数，返回单例
  factory MySharedPreferences() => _instance;

  // 私有构造函数
  MySharedPreferences._internal();

  // 初始化方法，必须在APP启动时调用
  Future<void> init() async {
    _prefs = await SharedPreferences.getInstance();
  }

  // 获取用户名
  String? get username {
    final dataList = _prefs.getStringList('mySp');
    return dataList?.isNotEmpty == true ? dataList[0] : null;
  }

  // 获取职位
  String? get job {
    final dataList = _prefs.getStringList('mySp');
    return dataList?.length >= 2 ? dataList[1] : null;
  }

  // 替换你原来的保存方法
  Future<void> saveUserData(String username, String job) async {
    await _prefs.setStringList('mySp', [username, job]);
  }
}

2. APP启动时初始化 #

在main函数里先初始化这个类，确保后续访问时SharedPreferences已就绪：

import 'package:flutter/material.dart';

void main() async {
  // 保证初始化SharedPreferences时Flutter环境已就绪
  WidgetsFlutterBinding.ensureInitialized();
  // 初始化单例
  await MySharedPreferences().init();
  runApp(const MyApp());
}

3. 在页面中调用 #

现在就能像你想要的那样，直接在page.dart里使用：

Text(MySharedPreferences().username ?? '未获取到用户名')

二、不使用SharedPreferences的全局变量方案 #

如果不需要持久化（APP重启后数据可丢失），可以用以下几种方式：

1. 内存单例类 #

直接创建存内存数据的单例类，API获取数据后赋值，其他页面直接访问：

class UserGlobalData {
  static final UserGlobalData _instance = UserGlobalData._internal();
  String? username;
  String? job;

  factory UserGlobalData() => _instance;

  UserGlobalData._internal();

  // API拿到数据后调用这个方法赋值
  void setUserData(String username, String job) {
    this.username = username;
    this.job = job;
  }
}

使用示例：

// API请求成功后赋值
UserGlobalData().setUserData('张三', '前端开发');

// 在page.dart中调用
Text(UserGlobalData().username ?? '未登录')

2. 状态管理工具（适合响应式场景） #

如果需要数据变化时页面自动刷新，可以用Provider、GetX这类状态管理工具。以Provider为例：

步骤1：创建状态类

import 'package:flutter/material.dart';

class UserProvider extends ChangeNotifier {
  String? _username;
  String? _job;

  String? get username => _username;
  String? get job => _job;

  void setUserData(String username, String job) {
    _username = username;
    _job = job;
    // 通知所有监听页面刷新
    notifyListeners();
  }
}

步骤2：注册状态

在main函数里把状态提供给整个APP：

void main() {
  runApp(
    ChangeNotifierProvider(
      create: (context) => UserProvider(),
      child: const MyApp(),
    ),
  );
}

步骤3：赋值与调用

// API请求成功后赋值（需要context）
Provider.of<UserProvider>(context, listen: false).setUserData('张三', '前端开发');

// 在page.dart中调用（自动响应数据变化）
Consumer<UserProvider>(
  builder: (context, provider, child) {
    return Text(provider.username ?? '未登录');
  },
)

内容的提问来源于stack exchange，提问作者Pointer