Dart 3中AuthScreen调用onChangedStep方法报错问题排查

错误根源 #

你遇到的报错是拼写不一致导致的：

• 在AuthScreen的StatefulWidget定义中，回调参数名为onChangeStep
• 但在两处调用时都写成了onChangedStep（多了一个字母d），Dart无法识别该方法

修复步骤 #

1. 修改AuthScreen中对回调的调用

在AuthScreen的_AuthScreenState里，将widget.onChangedStep(1)改为widget.onChangeStep(1)：

ElevatedButton(
  style: ElevatedButton.styleFrom(
    elevation: 0,
    backgroundColor: Theme.of(context).primaryColor,
    padding: const EdgeInsets.symmetric(vertical: 15.0),
  ),
  onPressed: !emailRegex.hasMatch(_email) ? null : () {
    if(_formKey.currentState!.validate()) {
      print(_email);
      // 修复拼写：去掉多余的d
      widget.onChangeStep(1);
    }
  },
  child: Text(
    'continue'.toUpperCase(),
    style: const TextStyle(color: Colors.white),
  ),
),

2. 修改GuestScreen中传参的参数名

在GuestScreen的initState方法里，创建AuthScreen时将onChangedStep:改为onChangeStep:：

@override
void initState() {
  super.initState();
  _widgets.addAll([
    // 修复拼写：去掉多余的d
    AuthScreen(onChangeStep: (index) => setState(() => _indexSelected = index)),
    TermScreen(onChangedStep: (index) => setState(() => _indexSelected = index)),
    PasswordScreen(onChangedStep: (index) => setState(() => _indexSelected = index)),
  ]);
}

额外优化（可选） #

AuthScreen的构造函数可以简化key参数的写法，符合Flutter的最新规范：

class AuthScreen extends StatefulWidget {
  final Function(int) onChangeStep;
  // 简化key参数
  const AuthScreen({
    super.key, 
    required this.onChangeStep,
  });

  @override
  State<AuthScreen> createState() => _AuthScreenState();
}

内容的提问来源于stack exchange，提问作者Fabien Lebourgeois