You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter中setState()无法更新Text()组件问题求助

问题分析与解决方案

你遇到的UI不更新问题,核心原因是状态变量定义位置错误:你把displayedNumber、input这些需要维护状态的变量放在了build方法内部。每次调用setState()时,Flutter会重新执行build方法,这些变量会被重新初始化回初始值(比如displayedNumber被重置为0.0),导致屏幕上的数值永远不会变化。

修复后的完整代码

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: Home(),
  ));
}

class Home extends StatefulWidget {
  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  // 将状态变量移到State类的成员位置,避免每次build被重置
  String name = 'Amir Mahdi Abravesh';
  String phoneNumber = '+989920250829';
  double input = 0.00;
  double displayedNumber = 0.0;

  // 用计算属性动态生成带$的字符串,避免重复拼接
  String get inputST => '\$$displayedNumber';

  void displayingDigits(){
    if(displayedNumber == 0.0){
      displayedNumber += input;
    } else {
      displayedNumber = displayedNumber * 10;
      displayedNumber += input;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: Center(
          child: Text(
            'Send Money to',
            style: TextStyle(
              color: Colors.black,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
        centerTitle: true,
        backgroundColor: Colors.white,
        elevation: 0,
      ),
      body: Column(
        children: <Widget>[
          SizedBox(height: 10,),
          Expanded(
            child: Center(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  CircleAvatar(
                    backgroundImage: AssetImage('assets/AMA25 trs.png'),
                    backgroundColor: Colors.black,
                    radius: 30,
                  ),
                  SizedBox(height: 5,),
                  Text(
                    '$name',
                    style: TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 20,
                    ),
                  ),
                  SizedBox(height: 5,),
                  Text(
                    '$phoneNumber',
                    style: TextStyle(
                      color: Colors.grey,
                    ),
                  ),
                ],
              ),
            ),
          ),
          Expanded(
            child: Container(
              padding: EdgeInsets.all(30),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  // 这里可以直接用inputST显示带$的数值
                  Text(
                    inputST,
                    style: TextStyle(
                      fontSize: 30,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  Divider(
                    height: 30,
                    color: Colors.grey[700],
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      TextButton(
                        onPressed: () {
                          setState(() {
                            displayedNumber = 50.0;
                          });
                        },
                        child: Container(
                          padding: EdgeInsets.symmetric(vertical: 10, horizontal: 15),
                          decoration: BoxDecoration(
                            border: Border.all(color: Colors.grey),
                            borderRadius: BorderRadius.circular(15),
                          ),
                          child: Text(
                            '\$50',
                            style: TextStyle(
                              color: Colors.grey,
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

关键修改点

  1. 状态变量位置调整:把name、phoneNumber、input、displayedNumber这些需要保持状态的变量移到_HomeState类的成员区域,脱离build方法,这样它们的数值会在State实例的生命周期内被保留,不会每次build都重置。
  2. 优化字符串生成:用计算属性inputST动态生成带$的数值字符串,避免在build方法里重复拼接,代码更简洁高效。

现在点击$50按钮,displayedNumber会被正确设置为50.0,并且UI会实时更新显示这个数值。

内容的提问来源于stack exchange,提问作者Amir Abravesh

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.31 08:59:13