如何通過 Flutter Provider 創建和更新 Dynamic Widgets 的值

Question

所以我正在實施如下所示的內容：

class TempProvider extends ChangeNotifier(){
    List<Widget> _list = <Widget>[];
    List<Widget get list => _list;
    int _count = 0;
    int get count => _count;

    Future<List<Widget>> getList() async{
        addToList(Text('$count'));

        List _result = await db....
        _result.forEach((_item){
            addToList(Button(
                onTap: () => increment();
                child: Text('Press'),
            ));
        });
    }

    addToList(Widget widget){
        _list.add(widget);
        notifyListeners();
    }

    increment(){
        _count += 1;
        notifyListeners();
    }
}

class Parent extends StatelessWidget{
    @override
    Widget build(BuildContext context) {
        return FutureProvider(
        create: (context) => TempProvider().getList(),
        child: Child(),
        );
    }   
}

class Child extends StatelessWidget{
    @override
    Widget build(BuildContext context) {
    var futureProvider = Provider.of<List<Widget>>(context);

        return Container(
        child: futureProvider == null 
            ? Text('Loading...'
            : ListView.builder(
                itemCount: futureProvider.length,
                itemBuilder: (BuildContext context, int index){
                    return futureProvider[index];
                }
            ),
        ));
    }   
}

基本上，它的作用是來自 Future 的小部件列表是我擁有的 ListView Builder 的內容，因為它的對象是從數據庫查詢生成的。 這些小部件是按下時應更新“計數”值並應更新顯示最新“計數”值的文本小部件的按鈕。

我能夠測試按鈕，它們似乎可以工作，並且正在通過后端增加 _count 值，但是，即使 Provider 值已更新，Text Widget 上顯示的“Count”也不會更新。

我想就這里的問題尋求您的幫助，根據我的理解，只要值發生變化，事情就應該更新，這是 Provider 反模式，我是否必須重建整個 ListView，或者我錯過了其他東西？

我仍在熟悉這個包和一般的 dart/flutter，希望您能與我分享您在這方面的專業知識。 非常感謝您提前。

Answer 1

所以昨晚和今天早上我一直在進行大量的研究和大量的試驗和錯誤，我只是不小心碰到了一個有效的想法！

您只需要將監聽值放在消費者小部件上，確保它監聽我們已經在小部件樹中更高層實現的最近的提供者。 （考慮到我已經在 FutureProvider 小部件下方繪制了我的 ListView 構建器）

..getList() async{
    Consumer<ChallengeViewProvider>(
        builder: (_, foo, __) => Text(
            '${foo.count}',
        ),
    );

    List _result = await db....
    _result.forEach((_item){
        addToList(Button(
            onTap: () => increment();
            child: Text('Press'),
        ));
    });
}

我還重構了我的小部件並將 Button 作為無狀態小部件拉出以供重用。 盡管確保引用的 Button 訂閱了具有 Counter 值的同一個父提供者，並讓 onTap 屬性通過 Provider<>.of 調用 increment() 函數

希望這對未來的任何人都有幫助！