按下时的 setState 创建新对象

Question

按下之前只有3个按钮，但是按下任何按钮后你可以看到有6个按钮

我正在尝试为我的应用程序创建评级系统，但每当我按下一个按钮时，都会创建一个新按钮，我不太确定为什么会这样。

如果我在没有 setState() 的情况下尝试运行并且按下按钮，则不会创建新对象，这就是我最终想要的。

import 'package:flutter/material.dart';

class Rating extends StatefulWidget {
  @override
  _RatingState createState() => _RatingState();
}

class _RatingState extends State<Rating> {
  final List<IconData> iconsImage = [
    Icons.star,
    Icons.star,
    Icons.star,
    Icons.star,
  ];
  List<ButtonTheme> buttonsList = new List<ButtonTheme>();

  List<Widget> _buildButtons() {
    for (int i = 0; i < 3; i++) {
      buttonsList.add(ButtonTheme(
        height: 20,
        minWidth: 40,
        child: FlatButton(
          onPressed: () {
            //When i press button new star is created not sure why
            setState(() {
              print(i);
            });
          },
          child: Icon(Icons.star),
        ),
      ));
    }
    return buttonsList;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[900],
      body: Container(
        child: Column(
          children: <Widget>[
            Container(
              child: Text('Rate the homework',
                  style: TextStyle(
                    color: Colors.white,
                  )),
            ),
            Divider(
              height: 30,
              color: Colors.red,
            ),
            Row(
              children: _buildButtons(),
            )
          ],
        ),
      ),
    );
  }
}

Answer 1

将您的 _buildButtons 方法放在 build 函数中。

原因：State Class in Stateful Widget are meant to hold and persist the state even during rebuild so that old state is remembered.

Here buttonsList is your state which will not be overwritten. So Clicking button (which will set state) will push new button to an existing button list(not to a newly created list).

解决方案：If you initialize you buttonsList inside a build function,it will also be reinitialized during re-build. So Clicking button (which will set state) will push new button to an newly created button list(not to a existing created list).

import 'package:flutter/material.dart';

class Rating extends StatefulWidget {
  @override
  _RatingState createState() => _RatingState();
}

class _RatingState extends State<Rating> {
  @override
  Widget build(BuildContext context) {
    List<ButtonTheme> buttonsList = new List<ButtonTheme>();

    List<Widget> _buildButtons() {
      for (int i = 0; i < 3; i++) {
        buttonsList.add(ButtonTheme(
          height: 20,
          minWidth: 40,
          child: FlatButton(
            onPressed: () {
              //When i press button new star is created not sure why
              setState(() {
                print(i);
              });
            },
            child: Icon(Icons.star),
          ),
        ));
      }
      return buttonsList;
    }

    return Scaffold(
      backgroundColor: Colors.grey[900],
      body: Container(
        child: Column(
          children: <Widget>[
            Container(
              child: Text('Rate the homework',
                  style: TextStyle(
                    color: Colors.white,
                  )),
            ),
            Divider(
              height: 30,
              color: Colors.red,
            ),
            Row(
              children: _buildButtons(),
            )
          ],
        ),
      ),
    );
  }
}

按下时的 setState 创建新对象

setState upon pressing creates new object

setstate

dart

flutter