文本未更新为 flutter 中的新值

Question

嗨，我是 flutter 的新手，正在尝试使用有状态的小部件。我正在尝试构建一个计时器并希望在文本中显示它。

这是我的小部件class。

class MobileVerification extends StatefulWidget {
  static const String MOBILE = 'mobile';
  final Map<String, dynamic> args;

  MobileVerification(this.args);

  @override
  State<StatefulWidget> createState() {
    return MobileVerificationState(args);
  }
}

这是我的状态class

class MobileVerificationState extends State<MobileVerification> {
  int remainingTime = 30;
  Timer timer;
  bool isResendBtnEnabled = false;

  MobileVerificationState(this.args);

  @override
  void initState() {
    super.initState();
    startResendTimer();
  }

  startResendTimer() {
    timer = new Timer.periodic(new Duration(seconds: 1), (time) {
      setState(() {
        remainingTime -= 1;
      });
      if (remainingTime == 0) {
           time.cancel();
           setState(() {
           isResendBtnEnabled = true;
        });
      }
    });
  }

  @override
  void dispose() {
    timer.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return CustomScreenBg(
        body: _getOtpVerificationPage());
  }

  _getOtpVerificationPage() {
    return Container(
      margin: EdgeInsets.only(top: 24, bottom: 24, left: 12, right: 12),
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          getResendWidget(),
          CustomButton(
            AppString.verify,
            isValidateBtnEnabled ? _onValidate : null,
            textColor: AppColor.WHITE.color,
            bgColor: AppColor.PRIMARY.color,
          ),
        ],
      ),
    );
  }

  Widget getResendWidget() {
    Logger.d(remainingTime.toString()); // Here I am getting changed value.
    if (isResendBtnEnabled) {
      return CustomButton(
        AppString.resend,
        _onResend,
        textColor: AppColor.WHITE.color,
        bgColor: AppColor.PRIMARY.color,
      );
    }
    return RichText(
      text: TextSpan(
        text: 'Resend in ${remainingTime}s',  <== But here value is not getting reflected. It stays same as 30
        style: TextStyle(color: AppColor.GRAY.color, fontSize: 18),
      ),
    );
  }
}

计时器工作得很好，我也得到了更新值。但是更新后的值并没有在 RichText 中反映出来。有人可以指出我在哪里犯了错误吗？谢谢！！

Answer 1

我犯了一个错误。 我使用StatefulWidget代替statelessWidget进行继承。希望它能帮助到别人。我已经创建了自己的自定义小部件以供使用。我的小部件结构如下：

class CustomScreenBg extends StatefulWidget {
  final String title;
  final Widget body;

  CustomScreenBg(this.title, this.body);

  @override
  State<StatefulWidget> createState() {
   return _CustomScreenBgState(title, body);
  }
}

class _CustomScreenBgState extends State<CustomScreenBg> {
  final String title;
  final Widget body;

  _CustomScreenBgState(this.title, this.body);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      backgroundColor: AppColor.SNOW_WHITE.color,
      body: SingleChildScrollView(child: body),
      resizeToAvoidBottomInset: true,
    );
  }

}

我将其更改为以下并且工作正常。

class CustomScreenBg extends StatelessWidget {
  final String title;
  final Widget body;

  CustomScreenBg(this.title, this.body);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      backgroundColor: AppColor.SNOW_WHITE.color,
      body: SingleChildScrollView(child: body),
      resizeToAvoidBottomInset: true,
    );
  }
}

文本未更新为 flutter 中的新值

Text not getting updated with new value in flutter

dart

flutter

statelesswidget