Flutter 颤振状态生成器仅更新列表中项目的录音计数器

在这个关于如何使用

StatesRebuilder

的基本示例中，单击一个项目会增加

计数器的值

这意味着：

当我点击第一个项目时，
计数器
是
1
，点击其他项目后，
计数器
增加到
2
，但它应该保持在
1
而不是
2

计数器
值不应从我点击的上一项继承

我的代码不正确：

import 'package:flutter/material.dart';
import 'package:states_rebuilder/states_rebuilder.dart';

class CounterBlocOne extends StatesRebuilder {
  Map<String,dynamic> _map = Map<String,dynamic>();

  int counter = 0;

  increment(tagID) {
    counter = _map[tagID];
    _map[tagID] = counter++;
    rebuildStates([tagID]);
  }
}

class RebuildOneExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Injector(
      models: [() => CounterBlocOne()],
      builder: (_, __) => CounterGrid(),
    );
  }
}

class CounterGrid extends StatelessWidget {
  final bloc = Injector.get<CounterBlocOne>();
  @override
  Widget build(BuildContext context) {
    return StateWithMixinBuilder(
      mixinWith: MixinWith.automaticKeepAliveClientMixin,
      builder: (_, __) => Padding(
            padding: EdgeInsets.all(10),
            child: Column(
              children: <Widget>[
                Text("Rebuild The tapped widget"),
                Text(
                    "This page is mixin with automaticKeepAliveClientMixin to not rebuild on sweep in"),
                Expanded(
                  child: GridView.count(
                    crossAxisCount: 3,
                    children: <Widget>[
                      for (var i = 0; i < 12; i++)
                        StateBuilder(
                          viewModels: [bloc],
                          builder: (_, tagID) => GridItem(
                                count: bloc.counter,
                                onTap: () => bloc.increment(tagID),
                              ),
                        )
                    ],
                  ),
                ),
              ],
            ),
          ),
    );
  }
}

class GridItem extends StatelessWidget {
  final int count;
  final Function onTap;
  GridItem({this.count, this.onTap});
  @override
  Widget build(BuildContext context) {
    return InkWell(
      child: Container(
        margin: EdgeInsets.all(5),
        decoration: BoxDecoration(
          color: Colors.lightBlue,
          border:
              Border.all(color: Theme.of(context).primaryColorDark, width: 4),
          borderRadius: BorderRadius.circular(6),
        ),
        child: Center(
          child: Text(
            "$count",
            style: TextStyle(
              color: Colors.white,
              fontSize: 50,
            ),
          ),
        ),
      ),
      onTap: onTap,
    );
  }
}

导入“包装：颤振/材料.省道”；
导入“包：states_rebuilder/states_rebuilder.dart”；
类CounterBlocOne扩展了StatesBuilder{
Map _Map=Map（）；
int计数器=0；
增量（标记ID）{
计数器=_映射[tagID]；
_map[tagID]=计数器++；
重建状态（[tagID]）；
}
}
类重建eExample扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
回程喷油器(
型号：[（）=>CounterBlocOne（）]，
生成器：（，_）=>CounterGrid（），
);
}
}
类CounterGrid扩展了无状态小部件{
final bloc=Injector.get（）；
@凌驾
小部件构建（构建上下文）{
返回状态WithMixinBuilder(
mixinWith:mixinWith.automatickePaLiveClientMixin，
生成器：（u，u）=>填充(
填充：边缘设置。全部（10），
子：列(
儿童：[
文本（“重建被点击的小部件”），
正文(
“此页面与AutomaticEpaLiveClientMixin混合，无法在扫描时重建”），
扩大(
子项：GridView.count(
交叉轴计数：3，
儿童：[
对于（变量i=0；i<12；i++）
建国者(
viewModels:[集团]，
构建器：（u，tagID）=>GridItem(
伯爵：集团计数器，
onTap:（）=>bloc.increment（tagID），
),
)
],
),
),
],
),
),
);
}
}
类GridItem扩展了无状态小部件{
最终整数计数；
最终功能onTap；
GridItem（{this.count，this.onTap}）；
@凌驾
小部件构建（构建上下文）{
回墨槽(
子：容器(
保证金：所有（5），
装饰：盒子装饰(
颜色：颜色。浅蓝色，
边界：
边框。全部（颜色：主题。背景）。原色深，宽度：4），
边界半径：边界半径。圆形（6），
),
儿童：中心(
子：文本(
“$count”，
样式：TextStyle(
颜色：颜色，白色，
尺寸：50，
),
),
),
),
onTap:onTap，
);
}
}
屏幕截图：


在您的应用程序中进行2个更改

increment(tagID) {

  counter = _map[tagID] ?? 0; // change this
  _map[tagID] = ++counter; // and this

  rebuildStates([tagID]);
}