title: Dart jsonEncode giving me error Unhandled Exception: Converting object to an encodable object failed
body: <p>I am getting an error while jsonEncode  </p>
  
  <p><code>Unhandled Exception: Converting object to an encodable object failed: Instance of 'WordPair'</code>  </p>
  
  <p>I have read about the json_annotation and json_serializable but I do not know how they can be of help in my case. I do not know how to use it when I don't have access to the "WordPair" class.  </p>
  
  <p>Here in the code, we are using english_words package to get random "WordPair"s. I am trying to save some favorite words that have been selected by the user into shared_preferences. But I don't know how to make the List serializable. I am very new to Dart and Flutter. Please help.  </p>
  
  <pre><code>import "package:flutter/material.dart";
  import "package:english_words/english_words.dart";
  import 'package:shared_preferences/shared_preferences.dart';
  import 'dart:convert';
  
  class RandomWords extends StatefulWidget {
    @override
    RandomWordsState createState() =&gt; RandomWordsState();
  }
  
  class RandomWordsState extends State&lt;RandomWords&gt; {
    final _randomWordPairs = &lt;WordPair&gt;[];
    final _savedWordPairs = Set&lt;WordPair&gt;();
  
    Future&lt;void&gt; _setSavedWordPairs() async {
      List&lt;WordPair&gt; savedWordPairsList = _savedWordPairs.toList();
      SharedPreferences prefs = await SharedPreferences.getInstance();
      await prefs.setString("wordpairs", jsonEncode(savedWordPairsList));
      print(prefs.getString("wordpairs"));
    }
  
    Future&lt;void&gt; _getSavedWordPairs() async {
      SharedPreferences prefs = await SharedPreferences.getInstance();
      String savedWordPairsString =
          prefs.getString("wordpairs") ?? jsonEncode(&lt;WordPair&gt;[]);
      List&lt;WordPair&gt; savedWordPairsList = jsonDecode(savedWordPairsString);
      print(savedWordPairsList);
      setState(() {
        _randomWordPairs.addAll(savedWordPairsList);
        _savedWordPairs.addAll(savedWordPairsList);
      });
    }
  
    Widget _buildList() {
      return ListView.builder(
        padding: const EdgeInsets.all(16.0),
        itemBuilder: (context, item) {
          if (item.isOdd) return Divider();
  
          final index = item ~/ 2;
  
          if (index &gt;= _randomWordPairs.length) {
            _randomWordPairs.addAll(generateWordPairs().take(10));
          }
  
          return _buildRow(_randomWordPairs[index]);
        },
      );
    }
  
    Widget _buildRow(WordPair pair) {
      final alreadySaved = _savedWordPairs.contains(pair);
  
      return ListTile(
        title: Text(pair.asPascalCase, style: TextStyle(fontSize: 18.0)),
        trailing: Icon(
          alreadySaved ? Icons.favorite : Icons.favorite_border,
          color: alreadySaved ? Colors.red : null,
        ),
        onTap: () {
          setState(() {
            if (alreadySaved) {
              _savedWordPairs.remove(pair);
            } else {
              _savedWordPairs.add(pair);
            }
          });
          _setSavedWordPairs();
        },
      );
    }
  
    void _pushSaved() {
      Navigator.of(context)
          .push(MaterialPageRoute(builder: (BuildContext context) {
        final Iterable&lt;ListTile&gt; tiles = _savedWordPairs.map((WordPair pair) {
          return ListTile(
              title: Text(pair.asPascalCase, style: TextStyle(fontSize: 16.0)));
        });
  
        final List&lt;Widget&gt; divided =
            ListTile.divideTiles(context: context, tiles: tiles).toList();
  
        return Scaffold(
          appBar: AppBar(
            title: Text("Saved WordPairs"),
          ),
          body: ListView(
            children: divided,
          ),
        );
      }));
    }
  
    @override
    void initState() {
      super.initState();
      _getSavedWordPairs();
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
          appBar: AppBar(
            title: Text("WordPair Generator"),
            actions: &lt;Widget&gt;[
              IconButton(
                icon: Icon(Icons.list),
                onPressed: _pushSaved,
              )
            ],
          ),
          body: _buildList());
    }
  }
  
  </code></pre>