如何将SharedPreference读取值赋值给build内变量并绑定到Text组件

• async 异步方法返回的是 Future 对象，未添加 await 时无法直接拿到返回结果，你在 build 方法中直接调用 getCompany() 没有等待异步执行完成，自然拿到的是 Future 实例
• 存值时使用的key是 savedCompany，取值时用的key是 storedCompany，key不匹配会无法读取到预期值
• 自定义的 SharedPref.read() 方法逻辑存在类型问题：你存储的是字符串类型，但 getString 为空时返回了int类型的0，存在类型异常风险
• 异步获取到值之后没有调用 setState 触发组件重绘，就算 savedCompany 赋值成功，Text组件也不会更新显示

补充注意：你存值的时候用了jsonEncode包裹了字符串，所以取到值之后需要调用jsonDecode(result)才能拿到原始的不带引号的字符串内容。

第一步：修复SharedPref类逻辑 #

// 明确返回类型，统一处理字符串返回
Future<String?> read(String key) async {
  final prefs = await SharedPreferences.getInstance();
  return prefs.getString(key);
}

Future<void> save(String key, String value) async {
  final prefs = await SharedPreferences.getInstance();
  await prefs.setString(key, value);
}

第二步：修复组件读取逻辑，两种实现可选 #

方式1：通过setState触发重绘 #

class _SideBarState extends State<SideBar> {
  SharedPref sharedPref = SharedPref();
  String? savedCompany;
  // key要和存值时保持一致
  String key = 'savedCompany';

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    getCompany();
  }

  Future<void> getCompany() async {
    final result = await sharedPref.read(key);
    // 若需要解码jsonEncode的内容，可改为 jsonDecode(result ?? '')
    setState(() {
      savedCompany = result;
    });
  }

  @override
  Widget build(BuildContext context) {
    // 空值时显示占位文本
    return Text(savedCompany ?? '加载中...');
  }
}

方式2：通过FutureBuilder更优雅的处理异步状态 #

class _SideBarState extends State<SideBar> {
  SharedPref sharedPref = SharedPref();
  String key = 'savedCompany';
  late Future<String?> _companyFuture;

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    _companyFuture = sharedPref.read(key);
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<String?>(
      future: _companyFuture,
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const Text('加载中...');
        }
        if (snapshot.hasError) {
          return const Text('加载失败');
        }
        // 若需要解码可改为 jsonDecode(snapshot.data ?? '')
        return Text(snapshot.data ?? '暂无企业信息');
      },
    );
  }
}

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