在我们开发多屏app的时候，我们更倾向于复用一些类的代码去完成一些功能，让代码能够“高复用”，比如：全局错误提示、页面的公共视图部分的复用、响应式编程（Bloc）里面的依赖逻辑等。使用抽象类abstract基本上就能完成这些功能，但是问题来了，如果页面上的公共部分我不想用到所有页面，只想在特定的页面上用，那该怎么办呢? 比如AppBar, 部分页面不需要公共的，而需要自定义，因为一个class类只能是一个类的子类，而我们需要更灵活的类的组合，这就是我们为什么需要mixin。

mixins 与 基础类：介绍
Mixins 让我们在脱离父类子类关系约束的条件下给类添加一些“新功能”，允许我们在同一个类中有一个父级类和多个mixin组件。然而，因为它不是我们类的父类，所以mixins不允许有任何构造函数声明。你可以阅读更多相关与mixin的文章 What are mixins?，或者查看官方文档 documentation;
mixin到底是怎么用的？让我们先举一个例子，新建一个abstract class Person：

abstract class Person { void think() { print("Hmm, I wonder what I can do today"); } }

我们可以用extend关键字把这个类作为父类来使用，比如：

class Mike extends Person {}

然后，我们初始化这个类，并且调用父类的方法 think()：

void main() { var mike = Mike(); mike.think(); // prints: "Hmm, I wonder what I can do today" }

但是我们要这么给Mike添加一些其他“新功能”呢？比如Mike是一位 coder ，他有coder的一些特性，但不是所有人都有，该怎么办呢？ mixin就能解决这个问题。
首先，我们需要创建一个mixin类并添加一我们需要的新的方法：

mixin Coder { void code() { print("Coding intensifies"); } }

使用关键字with,我们能将这个“新功能”添加给Mike:

class Mike extends Person with Coder {}

【Flutter的最佳实践（mixins|Flutter的最佳实践：mixins 与 基础类）】并且，与父类一样，我们可以调用在Coder中创建的所有函数：

void main() { var mike = Mike(); mike.code(); // prints: "Coding intensifies" }

现在，每一个使用 mixin coder的类都拥有coder的方法，然而这带来了一个问题：这意味着，如果我们有一个带有子级Squirrel的父类Animal，那么我们也可以拥有一个可以code（）方法的Squirrel！为了防止这种情况，我们可以使用关键字on将mixin的使用“锁定”到一个类以及从该类继承的所有类：

mixin Coder on Person{ void code() { print("Coding intensifies"); } }

这相当于为我们提供了一个强大的工具：现在我们可以覆盖重写在Person类中设置的方法用来添加或扩展其功能。

mixin Coder on Person{ //...@override void think() { super.think(); print("I'm going to code today!"); } }

调用super.think（）可确保我们仍然可以调用Person中定义的代码，上面的代码扩展了Mike类的think()方法将会输出：

Hmm, I wonder what I can do today I'm going to code today!

通过掌握基类abstract和mixin的概念，我们可以将它们灵活的应用于Flutter app中。
mixins 与 基础类：一个实际的常用例子
先试着想一下这种情况我们在flutter app中应该怎么做：
在app中我们有两个页面是这样的：

文章图片
我们的app有几个屏幕如上面显示的那样。我们想共用每个屏幕的AppBar和background，我们可以使用mixin解决问题。
在这种情况下，我们都定义了屏幕标题，我们将创建一个基类，该基类具有一种提供屏幕名称的方法，该基类称为BasePage。我们也将仅在StatefulWidgets中应用mixins，因为我们的类将维护并更改其状态。这样，我们创建了两个用于页面的类：BasePage和BaseState 分别继承StatefulWidget和State 。

abstract class BasePage extends StatefulWidget { BasePage({Key key}) : super(key: key); }// TODO: Page为命名泛型 继承 BasePage,BaseState作为抽象基类，也会被子类继承，所以传入泛型限制参数类型 abstract class BaseState extends State { String screenName(); }

我们现在创建一个自定义mixin BasicPageMixin，在其中定义页面的背景和标题名称。

// TODO: BasicPage 是一个mixin,作用于BaseState和其基类, 抽取渲染页面公共部分 mixin BasicPage on BaseState { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(screenName()), ), body: Container( child: body(), color: Colors.amber, )); }Widget body(); }

由于body（）方法没有实例，因此使用此mixin的每个类都必须实现它，以确保我们不会忘记在页面中添加body（）。
在屏幕上面我们看到了FloatingActionButton，但是我们不是每个屏幕都需要展示它，该怎么办呢？我们可以声明一个新方法fab()，默认的渲染输出一个空的Container。如果继承的子类需要它，那么子类可以通过@override重写fab()来添加一个FloatingActionButton。

Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(screenName()), ), body: Container( child: body(), color: Colors.amber, )); floatingActionButton: fab(), }// NOTE: 这里没有在基类中初始化是因为渲染wedget 尽量写在子组件state中, 更好的状态管理,更好的性能 // TODO: body()子类必须实现 Widget body(); // TODO: fab()子类可选实现 Widget fab() => Container(); }

我们的mixin 已经创建好了， 我们来通过它新建一个页面：

class MyMixinHomePage extends BasePage { MyMixinHomePage({Key key}) : super(key: key); @override _MyMixinHomePageState createState() => _MyMixinHomePageState(); }class _MyMixinHomePageState extends BaseState with BasicPage{ @override String screenName() => "Home"; @override Widget body() { return Center(child: Text("This is a basic usage of a mixin")); } }

有了这个，我们现在只需要声明一个body（）和一个可能在屏幕中使用的fab（）小部件，从而节省了几十行代码。very nice !
组合 mixins
扩展一项新功能，我们的某些页面将请求服务器调用API，并且如果发生错误，我们需要以Snackbar的形式显示错误消息。此外，我们决定使用BLoC（响应式编程）体系结构，在该体系结构中，我们需要在创建每个页面时注入一个新的功能模块（也就是错误提示）。这两个问题将需要执行以下步骤：

注：关于响应式编程的知识请自行查阅，这里可以简单的理解为异步的全局事件监听机制。

• 在我们的BasePage构造函数中注入BLoC功能模块，以至于子类都有BLoC功能
• 在BaseState新建全局状态GlobalKey
• 创建一个新的mixin，使我们可以使用Snackbar在页面中显示BLoC发送的错误消息

我们新建BaseBloc，里面至提供数据的发送方法sink， 和数据的监听方法stream:

abstract class BaseBloc { final StreamController _errorSubject = StreamController(); Sink get errorSink => _errorSubject.sink; Stream get errorStream => _errorSubject.stream; }

因为对于bloc我们暂时没有其他的任何交互 ，我们的HomeBloc紧紧是继承它：

// TODO: 抽象类只能被继承，子类实例化后实现内部方法； class HomeBloc extends BaseBloc {}

我们通过更改BasePage的构造函数让它初始化包含bloc模块。这将使我们也更改所有对其进行扩展的子类，以将bloc添加到子类构造函数中。 bloc参数用作泛型类型，以便扩展它的每个子类都可以声明正确的bloc的类型。这可以确保在BaseState中调用它时，我们将获得正确的bloc类型，从而允许我们访问bloc其方法。

// TODO: 传入Bloc 命名泛型, 以限制bloc的类型 abstract class BasePage extends StatefulWidget { Bloc bloc; BasePage({Key key, this.bloc}) : super(key: key); }

之后在BaseState里面，我们声明一个scaffoldKey状态让它用来显示一个展示Snackbar的ScaffoldWidget：

abstract class BaseState extends State { String screenName(); GlobalKey scaffoldKey = GlobalKey(); }

mixin的一个很奇特的特性是，如果将它们“链接”到一个类，则它们可以覆盖其方法。这很有用，因为在StatefulWidget中，我们可以在initState方法中侦听bloc发出来的数据流。这样，为了显示错误消息，我们可以创建一个mixin来覆盖initState方法，并提供一些方法让得到的消息显示在Snackbar：

mixin ErrorHandlingMixin on BaseState { @override void initState() { super.initState(); widget.bloc.errorStream .listen((error) => showErrorSnackbar(error, scaffoldKey.currentState)); }void showErrorSnackbar(String event, ScaffoldState context) { print('scaffoldKey ${scaffoldKey.currentWidget}'); if (event != null) { context.showSnackBar(new SnackBar(content: new Text(event))); } } }

最后我们把它在BasicPage添加之后添加在我们的 MyMixinHomePage中：

class MyMixinHomePage extends BasePage { // TODO: HomeBloc实例化基类 重新赋值给bloc; MyMixinHomePage({Key key}) : super(key: key, bloc: HomeBloc()); @override _MyHomePageState createState() => _MyHomePageState(); }class _MyHomePageState extends BaseState with BasicPage, ErrorHandlingMixin { @override String screenName() => "Home"; @override Widget fab() => FloatingActionButton( child: Icon(Icons.error), onPressed: (){ widget.bloc.errorSink.add('A error message!'); }, ); @override Widget body() { return Center( child: Text("This is a basic usage of a mixinss"), ); } }

结语
最后我们发现，我们用了两个mixin和基础类abstract class，共用了我们app中的很多代码。
也许我们不需要为应用程序共用基本的UI，但是我们可以使用诸如ErrorHandlingMixin之类的mixin向用户提供错误反馈、全局loading显示、检测用户当前是否登录的显示等！
但是，同时创建基类和mixins是一个需要仔细考虑的过程，否则我们可能会在调用在基类和mixins中声明的一个方法时，编译器不知道选择哪一个（注意mixin的调用顺序与方法覆盖）；

注：本文原文出自 原文地址；在原文基础上加以补充理解与完善，完善了原文中没有写全的例子代码；

推荐阅读

• 

  美的中央空调采购安装合同,这几点尤其注意
• 

  【CSS3】|保姆级教程 CSS 知识点梳理大全，超详细！！！
• 

  实用的 Python 自动化办公技巧
• 

  自动刹车技术是否被叫停 汽车自动刹车在什么情况下触发
• 

  目前什么行业赚钱,具体如何操作？
• 

  绿厂|OPPO高管畅谈智能终端的发展走向，全力探索的绿厂都做了哪些？
• 

  advanced是什么化妆品
• 

  面对五十岁的富翁富婆和二十岁的靓女帅哥,穷光蛋的你会如何选择？
• 

  友谊伤感文案短句
• 

  c 开发需要学什么，想当c语言程序员 都要学习什么
• 

  ChatGPT如何影响社会生产生活？
• 

  家庭鸡块的做法 家常家鸡块怎么做
• 

  马桶堵了水快溢出来了怎么办
• 

  你最喜欢军事专家戴旭的哪一部著作？
• 

  各大银行visa信用卡对比 visa信用卡哪个银行好
• 

  考古发现我国远古时期有哪些乐器
• 

  《王者荣耀》外服出新英雄,集合了吕布杨戬和关羽的技能！网友：只会抄袭！如何评价？
• 

  八段锦能防身吗
• 

  支付宝怎么免押金租充电宝_支付宝免押金租充电宝方法教程
• 

  王者荣耀段位继承规则s19 王者荣耀段位继承规则表

• 热闹中的孤独
• JAVA（抽象类与接口的区别&重载与重写&内存泄漏）
• 放屁有这三个特征的，请注意啦！这说明你的身体毒素太多
• 一个人的旅行，三亚
• 布丽吉特，人生绝对的赢家
• 慢慢的美丽
• 尽力
• 一个小故事，我的思考。
• 家乡的那条小河
• 《真与假的困惑》???|《真与假的困惑》??? ——致良知是一种伟大的力量