ProxyWidget 和 InheritedWidget 都是用于在 Flutter 組件樹中傳遞數(shù)據(jù)的組件

ProxyWidget:

ProxyWidget 本身不包含任何 UI,它的作用是創(chuàng)建一個代理組件,將數(shù)據(jù)傳遞給這個代理組件的子組件。它的工作方式是:

1. ProxyWidget 提供 ProxyProvider,并指定數(shù)據(jù)類型。
2. 子組件使用 ProxyProvider.of<T>() 獲取這個數(shù)據(jù)。
3. 如果子組件也是 ProxyProvider,那么它還可以修改這個數(shù)據(jù)。
   ProxyWidget 允許在組件樹中自上而下地傳遞和修改數(shù)據(jù)。

簡單示例
class DataProxy extends ProxyProvider<int> {
  DataProxy({int data, Widget child}): super(data: data, child: child);
}

class WidgetA extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final int data = ProxyProvider.of<int>(context);
    print(data); // Prints 1

    return DataProxy(data: 2, child: WidgetB());
  }
}

class WidgetB extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final int data = ProxyProvider.of<int>(context);
    print(data); // Prints 2
  } 
}

所以,這個示例展示了 ProxyWidget 的兩個主要功能:
1. 向下傳遞數(shù)據(jù):DataProxy 將 int 類型的數(shù)據(jù)(初始值為 1)向下傳遞給子組件。
2. 允許修改數(shù)據(jù):WidgetA 通過 DataProxy 修改了向下傳遞的數(shù)據(jù),從 1 改為 2。

所以,ProxyWidget 的主要功能和作用是:

1. 在 Flutter 組件樹中傳遞數(shù)據(jù)。
2. 允許子組件獲取和修改這些數(shù)據(jù)。
3. 支持在數(shù)據(jù)向下流動的同時修改這些數(shù)據(jù)

InheritedWidget:

InheritedWidget 是一個抽象類,用于在組件樹中從祖先組件向后代組件傳遞數(shù)據(jù)。它的工作方式是:

1. 祖先組件提供 InheritedWidget 的實(shí)現(xiàn),并指定數(shù)據(jù)。
2. 后代組件使用 InheritedWidget.of() 獲取這個數(shù)據(jù)。
3. 如果后代組件也是 InheritedWidget,那么它還可以修改這個數(shù)據(jù)。
   InheritedWidget 允許在組件樹中自上而下地傳遞和修改數(shù)據(jù)。

class DataInherited extends InheritedWidget {
  final int data;

  DataInherited({this.data, Widget child}) : super(child: child);

  static DataInherited of(BuildContext context) {
    return context.dependOnInheritedWidgetOfExactType<DataInherited>();
  }

  @override
  bool updateShouldNotify(DataInherited oldWidget) {
    return data != oldWidget.data;
  }
}

class WidgetA extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final int data = DataInherited.of(context).data;
    print(data); // Prints 1
  } 
}

class ParentWidget extends StatefulWidget {
  @override
  _ParentWidgetState createState() => _ParentWidgetState();
}

class _ParentWidgetState extends State<ParentWidget> {
  int data = 1;
  
  @override
  Widget build(BuildContext context) {
    return DataInherited(
      data: data,
      child: WidgetA(),
    );
  }
}
這個示例展示了 InheritedWidget 的用法:
1. 我們定義了一個 DataInherited 類,繼承自 InheritedWidget,用于傳遞 int 類型的數(shù)據(jù)。
2. ParentWidget 是 DataInherited 的父組件,它提供了初始數(shù)據(jù) 1。
3. WidgetA 是 DataInherited 的子組件,它通過 DataInherited.of(context) 獲取到父組件傳下來的數(shù)據(jù) 1。
4. 如果 ParentWidget 中的數(shù)據(jù)發(fā)生變化,DataInherited 的 updateShouldNotify 方法會返回 true,引起子樹重建,WidgetA 會獲取到最新的數(shù)據(jù)。
5. DataInherited 作為 InheritedWidget,當(dāng)它插入或移除組件樹時,會調(diào)用 InheritedWidget 的生命周期方法。

所以,這個示例展示了 InheritedWidget 的三個主要功能:

1. 在組件樹中從父組件向子孫組件傳遞數(shù)據(jù)。
2. 當(dāng)數(shù)據(jù)變化時,自動引起子樹重建。
3. 有自己的生命周期方法。

區(qū)別:

1. 實(shí)現(xiàn)機(jī)制不同:

• ProxyWidget 通過創(chuàng)建一個代理組件來傳遞數(shù)據(jù)。子組件通過 ProxyProvider.of<T>() 獲取數(shù)據(jù)。
• InheritedWidget 直接將數(shù)據(jù)傳遞給子孫后代組件。子組件通過 InheritedWidget.of() 獲取數(shù)據(jù)。

2. 提供的功能不同:

• ProxyWidget 只提供了數(shù)據(jù)獲取和修改的功能。
• InheritedWidget 除了數(shù)據(jù)傳遞外,還提供了標(biāo)記子樹需重新構(gòu)建的功能(updateShouldNotify)。

3. 引起的重建不同:

• 如果 ProxyWidget 中的數(shù)據(jù)發(fā)生變化,它不會主動引起子組件的重建。子組件如果要響應(yīng)數(shù)據(jù)變化,需要自己調(diào)用 markNeedsBuild() 方法。
• 如果 InheritedWidget 中的數(shù)據(jù)發(fā)生變化,它會自動引起子樹的重建。

4. 生命周期不同:

• ProxyWidget 沒有自己的生命周期,它依附于子組件。
• InheritedWidget 有自己的生命周期,當(dāng)它被插入或移除組件樹時,會被調(diào)用。
  所以,總體來說:
• 如果只是簡單地想在組件樹中傳遞數(shù)據(jù),兩個組件都可以勝任。
• 如果除了數(shù)據(jù)傳遞外,還需要標(biāo)記子樹重建、響應(yīng) InheritedWidget 生命周期,則 InheritedWidget 更合適。
• 如果要避免 InheritedWidget 自動引起子樹重建,則 ProxyWidget 會更輕量一些。