如何从Stateless Widget调用Stateful Widget的setState方法

这里有个非常直接的方案，既能保持JoystickView在无状态组件中不被刷新，又能同步更新MyStateFull里的数值——使用GlobalKey来获取状态组件的实例，直接调用它的更新方法。

修改后的完整代码： #

import 'package:flutter/material.dart';
import 'package:control_pad/control_pad.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  // 创建GlobalKey，关联MyStateFull的State类
  final myStateFullKey = GlobalKey<_MyStateFullState>();

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: Column(
        children: <Widget>[
          Expanded(
            child: JoystickView(
              onDirectionChanged: (degree, direction) {
                // 通过GlobalKey获取State实例，调用更新方法
                myStateFullKey.currentState?.changedDirection(degree, direction);
              },
            ),
          ),
          Expanded(
            // 将GlobalKey传递给MyStateFull组件
            child: MyStateFull(key: myStateFullKey),
          ),
        ],
      ),
    );
  }
}

class MyStateFull extends StatefulWidget {
  // 接收外部传入的GlobalKey
  const MyStateFull({super.key});

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

class _MyStateFullState extends State<MyStateFull> {
  double degree = 10;
  double direction = 10;

  void changedDirection(double degree, double direction) {
    setState(() {
      this.degree = degree;
      this.direction = direction;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: Text(
        "The degree Moved is $degree and the direction is $direction",
        style: TextStyle(fontSize: 25, color: Colors.black),
        textAlign: TextAlign.center,
      ),
    );
  }
}

核心原理说明： #

• GlobalKey是Flutter中用来唯一标识Widget的工具，它能让我们在Widget树的任何地方获取到对应Widget的State实例。
• 我们在无状态的MyHomePage中创建GlobalKey，并传递给MyStateFull，这样就能在摇杆的回调里直接调用MyStateFull的changedDirection方法，触发setState更新UI。
• 这种方式完全不会影响JoystickView的状态，因为我们没有把它放进有状态组件中，完美符合你的需求。

扩展方案（复杂场景）： #

如果你的项目后续需要多个组件共享这类状态，推荐使用Riverpod或Provider这类轻量状态管理库，它们能更优雅地处理跨组件状态共享，避免直接使用GlobalKey带来的耦合问题。不过对于当前这个简单场景，GlobalKey已经是最轻便的解决方案了。

内容的提问来源于stack exchange，提问作者MOHAMMED NUMAN