如何防止多个 StatefulWidgets (ImageSliders) 覆盖彼此的内容？

Question

所以我试图将三个 ImageSlider 放在同一个 page/card 上。它们非常相似，这就是为什么我创建了一个 class 并且只是想传递不断变化的值。

这并没有真正按预期工作：现在最后调用的滑块只有三倍。

我认为它可能是相同的状态，正在被覆盖并试图传递一个唯一的密钥。

虽然没有改变任何事情。

滑块：

List<String> _imgList;
List<String> _nameList;
String _description;

class ShopListSlider extends StatefulWidget {
  ShopListSlider(
      {Key key,
      String description,
      @required List<String> imgList,
      @required List<String> nameList})
      : super(key: key) {
    _imgList = imgList;
    _nameList = nameList;
    _description = description;
  }

  @override
  _ShopListSliderState createState() => _ShopListSliderState();
}

class _ShopListSliderState extends State<ShopListSlider> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(...);
 }
}

调用滑块的小部件的内容：

child: Column(children: [
          SizedBox(height: 50),
          ShopListSlider(
              key: UniqueKey(),
              description: "Restaurants in Deiner Nähe",
              imgList: imgListNear,
              nameList: nameListNear),
          SizedBox(height: 50),
          ShopListSlider(
              key: UniqueKey(),
              description: "Beliebte Restaurants",
              imgList: imgListBest,
              nameList: nameListBest),
          SizedBox(height: 50),
          ShopListSlider(
              key: UniqueKey(),
              description: "Deine Favoriten",
              imgList: imgListFavorites,
              nameList: nameListFavorites),
        ]),

Answer 1

没有任何键也能正常工作。

问题是您的 class 变量不在 class 中，它们是包级别的，这基本上意味着所有小部件都是无状态的，共享一些全局状态。

只需将这些自己移动到 State 中，然后删除那些键：

class _ShopListSliderState extends State<ShopListSlider> {
   List<String> _imgList;
   List<String> _nameList;
   String _description;

Fwiw，像这样抛出一个 UniqueKey() 将强制在每次 build() 时重建一个小部件，无论它是否更改，这并不是您真正想要的。

如何防止多个 StatefulWidgets (ImageSliders) 覆盖彼此的内容？

How to prevent multiple StatefulWidgets (ImageSliders) from overriding each others contents?

state

flutter

statefulwidget