Flutter开发中如何跨Dart文件引用用户输入的数据？

安全阿岳

2026-8-28

Flutter跨Dart文件存储、引用用户姓名实现方案

按需选对应方案即可：

方案1：运行时全局共享（无本地持久化，APP关闭后数据清空）

不需要引入第三方依赖，适合不需要永久保存、仅APP运行期间跨页面共享数据的场景。

新建独立的状态管理文件user_state.dart，用单例模式管理共享的用户名数据：

import 'package:flutter/foundation.dart';

class UserState {
  // 单例构造，保证全局拿到的都是同一个实例
  static final UserState _instance = UserState._internal();
  factory UserState() => _instance;
  UserState._internal();

  // 可监听的用户名变量，值变化时所有引用的位置会自动更新
  final ValueNotifier<String> userName = ValueNotifier('');
}

在带姓名输入框的账号设置页，把TextField的输入内容同步到全局状态：

// 提前给TextField绑定的输入控制器
final TextEditingController _nameController = TextEditingController();

// 输入框组件代码
TextField(
  controller: _nameController,
  decoration: const InputDecoration(hintText: '请输入您的姓名'),
  onChanged: (value) {
    // 实时同步输入内容到全局状态
    UserState().userName.value = value.trim();
  },
)

在任意其他Dart文件的页面中，直接监听全局状态的用户名即可，不需要跨页面传参：

// 姓名展示位置组件
ValueListenableBuilder<String>(
  valueListenable: UserState().userName,
  builder: (context, savedName, child) {
    return Text(
      savedName.isEmpty ? '未设置姓名' : savedName,
      style: const TextStyle(fontSize: 16),
    );
  },
)

方案2：本地持久化存储（APP重启后仍能保留已输入的姓名）

如果需要把姓名永久存在本地，下次打开APP直接读取，用shared_preferences实现即可。

先在项目根目录的pubspec.yaml中添加依赖：

dependencies:
  flutter:
    sdk: flutter
  shared_preferences: ^2.2.2 # 可替换为pub上的最新稳定版本

配置完成后执行flutter pub get拉取依赖。

新建本地存储工具文件user_storage.dart，封装姓名的存、取方法：

import 'package:shared_preferences/shared_preferences.dart';

class UserStorage {
  static const _nameKey = 'saved_user_name';

  // 保存姓名到本地存储
  static Future<void> saveUserName(String name) async {
    final prefs = await SharedPreferences.getInstance();
    await prefs.setString(_nameKey, name.trim());
  }

  // 从本地存储读取已保存的姓名
  static Future<String> getUserName() async {
    final prefs = await SharedPreferences.getInstance();
    return prefs.getString(_nameKey) ?? '';
  }
}

账号设置页在用户触发保存操作（比如点击保存按钮、输入框失焦）时，调用保存方法：

ElevatedButton(
  onPressed: () async {
    final inputName = _nameController.text;
    if (inputName.trim().isEmpty) {
      // 这里可以加空输入提示
      return;
    }
    await UserStorage.saveUserName(inputName);
    // 同步更新全局状态，保证当前打开的页面实时展示最新姓名
    UserState().userName.value = inputName.trim();
  },
  child: const Text('保存姓名'),
)

其他展示姓名的页面，初始化时读取本地存储的姓名即可：

class ProfilePage extends StatefulWidget {
  const ProfilePage({super.key});

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {
  String _displayName = '';

  @override
  void initState() {
    super.initState();
    // 页面初始化时加载本地存的姓名
    _loadSavedName();
  }

  Future<void> _loadSavedName() async {
    final savedName = await UserStorage.getUserName();
    setState(() {
      _displayName = savedName;
    });
    // 同步把读到的值赋值给全局状态，方便后续全局监听
    UserState().userName.value = savedName;
  }

  @override
  Widget build(BuildContext context) {
    return Text(_displayName.isEmpty ? '未设置姓名' : _displayName);
  }
}

补充：如果项目后续需要管理更多全局状态，可以直接替换为Riverpod、Provider这类成熟的状态管理框架，核心逻辑和上面一致：把共享数据抽离到独立Dart文件维护，所有页面从统一数据源读值，避免跨页面层层传参的麻烦。

Flutter开发中如何跨Dart文件引用用户输入的数据？

按需选对应方案即可： #

方案1：运行时全局共享（无本地持久化，APP关闭后数据清空） #

方案2：本地持久化存储（APP重启后仍能保留已输入的姓名） #

按需选对应方案即可：

方案1：运行时全局共享（无本地持久化，APP关闭后数据清空）

方案2：本地持久化存储（APP重启后仍能保留已输入的姓名）