Flutter 中的动态嵌套列表项选择

Posted 2023-02-23

【中文标题】Flutter 中的动态嵌套列表项选择

【英文标题】：Dynamic Nested Listing Item Selection in Flutter

【发布时间】：2021-11-05 12:13:07

【问题描述】：

我将开发一个电子商务应用程序，并希望选择产品的不同属性。这些属性来自数据库并且它们是动态的。这是示例屏幕截图：

这里我们有三个属性：

袖子 脖子 设计

这些属性及其数量是动态的。属性可以多于 3 个。

现在在这种情况下，我们有两个列表。一个用于自我、颈部和设计。以及其他对应的值，如 full、half、without。

我想为所有的袖子、脖子和设计选择价值。

您能否提供我如何实现此场景的工作流程。

提前致谢。

【参考方案1】：

我有点不知道您的数据到底是什么样的，您获得了多少个列表？这些列表中的每一个都有什么？您能否发布您的代码，以便我更好地查看它们？

无论如何，我要做的是编写一个具有标题和值列表的类：

class Section 
  Section(required this.title, required this.values);
  String title;
  List<String> values;

然后，当您从数据库中获取项目时，您可以像这样构造它们：

// example
List<Section> sections = [
  Section(title: 'Sleeves', values: ['Full', 'Half', 'Without']),
  Section(title: 'Neck', values: ['Round', 'High']),
  Section(title: 'Design', values: ['Beioided', 'Print']),
];

然后在 UI 上，您会执行如下操作：

class SectionDisplay extends StatelessWidget 
  SectionDisplay(required this.sections);
  final List<Section> sections;

  @override
  Widget build(BuildContext context) 
    return ListView(
      children: sections.map((v) => _buildSection(v)).toList(),
    );
  

  Widget _buildSection(Section section) 
    
    return Column(children: [
      Text(section.title),
      Row(
        children: [
          for (var value in section.values)
            ElevatedButton(
              child: Text(value), 
              onPressed: () 
                int index = section.values.indexOf(value);
                print("$index'th value: $value");
              ,
        ],
      ),
    ]);
  

希望这是你所需要的。

【讨论】：

嗨，感谢您的回复，是的，这就是我的确切情况。但是如何从中选择值： List