在 StatefulWidget 之外调用 setState（使用 setter）

Question

我在 Javascript 方面有很多经验，现在我想从 Flutter 开始。所以也许我的问题是我将代码视为 JS 开发人员，而 Flutter 解决方案会有所不同。但这是我的问题： 我想创建一个简单的纸牌游戏。一张扑克牌是一个 StatefulWidget：

class GameCard extends StatefulWidget {

  int _value;
  String _suit;
  bool _visible;

  String _imagePath;

  // void setVisible() {
  //   How to execute setState here??
  // }

  GameCard({int value, String suit, bool visible = false}) {
    ...
    this._visible = visible;
    this._value = value;
    this._suit = suit;
  }

  @override
  _GameCardState createState() => _GameCardState();
}

class _GameCardState extends State<GameCard> {

  String getSuit() => widget._suit;
  int getValue() => widget._value;

  bool isVisible() => widget._visible;

  @override
  Widget build(BuildContext context) {
  ...
  return ClipRRect(
      borderRadius: BorderRadius.circular(10),
      child: Container(
        width: width,
        height: width * 1.5,
        decoration: BoxDecoration(
          image: DecorationImage(
            fit: BoxFit.cover,
            image: AssetImage(widget._imagePath), 
      ...

想法是当卡片不可见时，状态类中的 imagePath 应该是卡片背面的图像。 现在我想在我的 StatefulWidget 中有一个 setVisible 函数，它运行 setState()，然后更新 imagePath。之后 imagePath 应该是一张纸牌的图像，例如红桃王。 所以最后我想在其他地方创建一个 GameCard 实例并使用 setter 更改图像：

GameCard spadeFour = GameCard(value: 4, suit: 'spade', visible: false),
spadeFour.setVisible(true)

我该怎么做？我阅读了有关 Globalkey 和其他内容的信息，但它不可能那么复杂，因为这是一个非常常见的用例。

Answer 1

通常您应该避免实例化一个小部件，然后通过属性对其进行修改。这也是不必要的，因为您已经正确使用参数来更改小部件的外观。

要让小部件使用不同的参数重绘，而不是在该小部件中调用 setState，而是在父小部件中调用它。

class _YourParentPageState extends State<YourParentPage> {

  bool visible = false;

  _changeVisibility(bool v) {
    setState(() {
      visible = v;
    });
  }
  
  @override
  Widget build(BuildContext context) {
    return GameCard(value: 4, suit: 'spade', visible: visible);
  }
}

调用 _changeVisibility 将使用更新后的可见参数重绘您的 GameCard。