Flutter 在阿里淘系的体系化建设和业务实践

在Flutter中，构建一个高效的组件复用策略是至关重要的。以下是一个简化的例子，展示了如何在Flutter中定义一个可以在不同页面复用的组件：

import 'package:flutter/material.dart';
 
class CustomWidget extends StatelessWidget {
  final String title;
  final String content;
 
  const CustomWidget({Key key, this.title, this.content}) : super(key: key);
 
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            title,
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
          ),
          SizedBox(height: 8.0),
          Text(content),
        ],
      ),
    );
  }
}
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: CustomWidget(
          title: '标题',
          content: '这是一段内容。',
        ),
      ),
    );
  }
}

在这个例子中，CustomWidget 是一个可复用的组件，它接受 title 和 content 作为参数，并在其 build 方法中返回一个格式化的 Container 包含这些信息。main 函数中的 MyApp 类展示了如何使用 CustomWidget。这种方式使得 CustomWidget 能够在不同的页面和场景下被复用，从而提高了代码的可维护性和效率。