Flutter中如何向自定义Widget类传递属性参数

你只需要给自定义Widget类声明对应final属性，同时实现命名参数形式的构造方法即可，修改后的完整代码如下：

class ToolbarToggle extends StatelessWidget {
  // 声明要接收的属性，StatelessWidget的属性必须为final类型
  final String label;

  // 实现构造函数：大括号包裹的参数为命名参数，必填参数加required修饰
  // 传入super.key是Flutter组件的标准最佳实践，构造加const修饰可提升性能
  const ToolbarToggle({
    super.key,
    required this.label,
  });

  @override
  Widget build(BuildContext context) {
    return Text(label);
  }
}

修改完成后你就可以直接用ToolbarToggle(label: 'a label')的形式调用组件。

补充说明 #

如果需要支持可选参数，只需要给参数设置默认值或者声明为可空类型即可，示例如下：

class ToolbarToggle extends StatelessWidget {
  final String label;
  // 可选参数，设置默认值
  final double fontSize;
  // 可选可空参数，无默认值
  final Color? textColor;

  const ToolbarToggle({
    super.key,
    required this.label,
    this.fontSize = 14,
    this.textColor,
  });

  @override
  Widget build(BuildContext context) {
    return Text(
      label,
      style: TextStyle(
        fontSize: fontSize,
        // 可空参数使用时做空安全处理
        color: textColor ?? Colors.black,
      ),
    );
  }
}

// 调用时可以选择是否传入可选参数
// ToolbarToggle(label: '测试', fontSize: 16, textColor: Colors.red)
// ToolbarToggle(label: '测试')

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