Flutter开发最佳实践咨询：重复RaisedButton的实现方案选择

嗨，很高兴能帮到你！针对你提出的Flutter按钮实现问题，咱们从最佳实践和性能影响两方面来聊聊：

最佳实践：自定义可复用组件是首选 #

你现在的写法会重复大量相同代码（比如elevation: 0.1、Navigator.push的逻辑），这不仅显得冗余，后期如果要修改按钮样式（比如改阴影、背景色），你得手动修改5次，非常容易出错。

更推荐的方式是抽取自定义组件，利用构造函数接收不同的文本和目标路由，这样既能减少重复代码，又能提升代码的可维护性。给你一个具体的实现示例：

第一步：创建自定义按钮组件 #

class CustomNavButton extends StatelessWidget {
  final String buttonText;
  final Widget targetPage;

  // 构造函数，接收文本和目标页面
  const CustomNavButton({
    Key? key,
    required this.buttonText,
    required this.targetPage,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      elevation: 0.1,
      child: Text(buttonText),
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => targetPage),
        );
      },
    );
  }
}

第二步：使用自定义组件 #

这样原来的children就会变得非常简洁：

children: <Widget>[
  CustomNavButton(
    buttonText: 'Attandence Tag',
    targetPage: UserTag(),
  ),
  CustomNavButton(
    buttonText: 'Add New Student',
    targetPage: CreateUser(),
  ),
  // 剩下3个按钮同理，只需要传不同的text和targetPage即可
],

性能影响：几乎可以忽略 #

你不用担心抽取组件会带来性能问题——Flutter中的Widget本身就是轻量级的“配置信息”，自定义组件本质上只是把现有Widget的组合逻辑封装起来，并不会增加额外的性能开销。

反而重复代码在编译时不会有优化优势，而自定义组件的写法更符合Flutter的组件化思想，长期来看能帮你减少维护成本，提升开发效率。

另外补充一点：现在Flutter官方已经推荐用ElevatedButton替代RaisedButton了，如果你是新版本的Flutter，可以考虑换成ElevatedButton，用法是一致的哦～

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