我如何在 flutter 中使用 Json 添加带有复选框列表磁贴的多个扩展磁贴

How can i add multiple expand tile with checkbox list tile using Json in flutter

这个json有两个数据,第一个只有名字,第二个在里面还有名字,也就是服务名。例如,'Travel and Stay' 和 'Religious' 是必须显示在扩展磁贴名称中的主要名称,而 'Church/ Baptism' 和 'Hindu Temples' 是显示在复选框列表磁贴中的子项。希望你明白:slightly_smiling_face: 请帮助我

class _MyHomePageState extends State<MyHomePage> {
  var lovCountryServices = [
    {
      "services": [
        {
          "service_group_id": 22,
          "service_category": "B",
          "name": "Air Tickets",
          "id": 228
        },
        {
          "service_group_id": 22,
          "service_category": "W",
          "name": "Boys Hostel",
          "id": 229
        },
      ],
      "name": "Travel and Stay",
      "is_active": true,
      "id": 22
    },
    {
      "services": [
        {
          "service_group_id": 19,
          "service_category": "B",
          "name": "Church/ Baptism",
          "id": 193
        },
        {
          "service_group_id": 19,
          "service_category": "B",
          "name": "Hindu Temples",
          "id": 194
        }
      ],
      "name": "Religious",
      "is_active": true,
      "id": 19
    }
  ];
  List<_Result> _results = [];

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
          child: Column(
        children: <Widget>[
          ListView.builder(
            shrinkWrap: true,
            padding: const EdgeInsets.all(8.0),
            itemCount: lovCountryServices.length,
            itemBuilder: (BuildContext context, int index) {
              var item = lovCountryServices[index];
              var items= lovCountryServices[index]['services'];
              return ExpansionTile(
                title: Text(item['name']),
                children: <Widget>[
                  CheckboxListTile(
                    title: Text("temp"),
                    value: item['is_active'],
                    onChanged: (val) {
                      setState(() {
                        item['is_active'] = val;
                      });
                    },
                  ),
                ],
              );
            },
          ),
          RaisedButton(
            onPressed: () => print("sending to backend"),
            child: Text("SEND"),
          )
        ],
      )),
    );
  }
}

我想要复选框列表中的数据,右侧有一个名为 TEMP 的虚拟数据,我现在想要来自 json 的数据,在 json 中有 'Boys Hostel' 这个数据需要进入复选框列表块。希望你不明白请帮助我

工作代码:您可以使用 Map 变量来存储布尔值。

  Map<String, bool> _selection = {};

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dummy'),
      ),
      body: Center(
          child: Column(
        children: <Widget>[
          ListView.builder(
            shrinkWrap: true,
            padding: const EdgeInsets.all(8.0),
            itemCount: lovCountryServices.length,
            itemBuilder: (BuildContext context, int index) {
              var item =
                  lovCountryServices[index]; // should be outside build function
              List items = item['services']; // should be outside build function
              return ExpansionTile(
                title: Text(item['name']),
                children: List.generate(items.length, (i) {
                  _selection[items[i]['name']] =
                      _selection[items[i]['name']] ?? item['is_active'];
                  return CheckboxListTile(
                    title: Text(items[i]['name']),
                    value: _selection[items[i]['name']],
                    onChanged: (val) {
                      setState(() {
                        _selection[items[i]['name']] = val;
                      });
                    },
                  );
                }),
              );
            },
          ),
          RaisedButton(
            onPressed: () => print("sending to backend"),
            child: Text("SEND"),
          )
        ],
      )),
    );
  }