Flutter中initState调用异步函数后build未获取值的问题求助

核心问题分析 #

1. initState里调用的load()是异步函数，build方法会优先执行，所以第一次打印时wordPair还是初始空值。
2. load里修改wordPair后没调用setState，就算异步操作完成，UI也不会自动刷新，后续也看不到更新后的值。
3. 代码里await "key : " + ...是错误写法，字符串不是Future，不需要加await，这会直接报错。

修正后的代码方案一：用setState刷新状态 #

class _WorterBuchState extends State<WorterBuch> with TickerProviderStateMixin {
  var wordPair = '' ;
  
  @override
  void initState(){
    super.initState();
    load();
  }

  Future<void> load() async{
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setString('key', 'value'); // 加await确保写入操作完成
    String? value = prefs.getString('key');
    wordPair = "key : " + (value ?? '默认值'); // 处理null情况，避免强制转换报错
    setState(() {}); // 通知Flutter刷新UI，触发重新build
  }

  @override
  Widget build(BuildContext context)  {
    print(wordPair);
    // 这里返回你的Widget，示例如下
    return Scaffold(body: Center(child: Text(wordPair)));
  }
}

更规范的方案二：用FutureBuilder处理异步 #

如果不想手动管理状态，推荐用FutureBuilder，它会自动监听Future的状态变化：

class _WorterBuchState extends State<WorterBuch> with TickerProviderStateMixin {
  late Future<String> _wordPairFuture;
  
  @override
  void initState(){
    super.initState();
    _wordPairFuture = load();
  }

  Future<String> load() async{
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setString('key', 'value');
    String? value = prefs.getString('key');
    return "key : " + (value ?? '默认值');
  }

  @override
  Widget build(BuildContext context)  {
    return FutureBuilder<String>(
      future: _wordPairFuture,
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const Center(child: CircularProgressIndicator()); // 加载中状态
        } else if (snapshot.hasError) {
          return Center(child: Text('出错了: ${snapshot.error}')); // 错误状态
        } else {
          final wordPair = snapshot.data ?? '';
          print(wordPair);
          return Scaffold(body: Center(child: Text(wordPair))); // 成功状态
        }
      },
    );
  }
}

关键注意点 #

• 异步操作完成后必须调用setState（方案一），或者用FutureBuilder自动处理状态（方案二），否则UI不会更新。
• 不要强制转换prefs.getString('key')为String，因为它可能返回null，用空合并运算符??处理更安全。
• prefs.setString是异步方法，最好加上await确保写入操作完成后再读取。

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