Generate a list of json objects after encoding

Question

var encoded_tags = json.encode(tag);

gives me a list like this:

{"id":"0","name":"Peter"}
{"id":"1","name":"Max"}
""

My question is how can I have [Peter,Max] list from this data? NOTE The third item is empty. My tag Model is:

class Tag {
  int id = 0;
  String name = '';

  Tag(int id, String name) {
    this.id = id;
    this.name = name;

  }

  Tag.fromJson(Map json)
      : id = json['id'],
        name = json['name'];

  Map toJson() {
    return {'id': id, 'name': name};
  }
}

I tried encoded_tags['name'] but it doesn't work.

PS: Here is the complete code: tag value is coming from an API get request, it has a Map type

class tagRetrievePreview extends StatelessWidget {
  var tag;
 
  tagRetrievePreview(this.tag, {Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {    
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Card(
          color: const Color.fromARGB(255, 224, 223, 223),
          shape: RoundedRectangleBorder(
            side: const BorderSide(
              color: Color.fromARGB(255, 83, 83, 83),
            ),
            borderRadius: BorderRadius.circular(50),
          ),
          child: Padding(
            padding: const EdgeInsets.all(3.0),
            child: Row(
              children: [
                Text( 
                      tag.toString(),
                      style: TextStyle(color: Colors.grey.shade800),
                      textAlign: TextAlign.center,
                    ),
                Padding(
                  padding: const EdgeInsets.all(2.0),
                  child: GestureDetector(
                    onTap: () {
                      print('Delete tag button tapped');
                    },
                    child: const CircleAvatar(
                        radius: 8,
                        backgroundColor: Color.fromARGB(255, 117, 112, 112),
                        child: Icon(
                          Icons.close,
                          size: 13,
                          color: Color.fromARGB(255, 255, 255, 255),
                        )),
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}

And the output is the list of 3 elements that I mentioned above, I just want it to be a list of the name values. Inspecting tag value result:

user_17169037 · Answer

The variable tag itself has the name and id. If you do json encode you are converting it to a string from which you cant access items like how you access from a key value pair.

You can access name and id like

//var encoded_tags = json.encode(tag);
// Remove the line above
print(tag.name);
print(tag.id);

EDIT

Use this model for Tag

class Tag {
  String? name;
  String? id;

  Tag({this.name, this.id});

  Tag.fromJson(Map json) {
    name = json['name'];
    id = json['id'];
  }

  Map toJson() {
    final Map data = new Map();
    data['name'] = this.name;
    data['id'] = this.id;
    return data;
  }
}

Then to convert your response to this type use

List _tag = json.decode(response.body).map((item)=> Tag.fromJson(item));
print(_tag[0].id);
print(_tag[0].name);

Generate a list of json objects after encoding

1 Answers