title: How to navigate to a specific route in a list full of the same widget?
body: <p>I have a an app which the user is able to add in books and it upload to the firestore database, and then I use a <code>streamBuilder()</code> to recieve all the data and display it in a list of <code>GestureDetector()</code> with the <code>card()</code> as a child.</p>
  <p>Here is the code for the</p>
  <pre><code>final bookWidget = GestureDetector(
                            key: ValueKey(loggedInUser.email),
                            onTap: () {
                              print(title);
                            },
                            child: Card(
                              semanticContainer: true,
                              clipBehavior: Clip.antiAliasWithSaveLayer,
                              child: Stack(
                                children: [
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.start,
                                    children: [
                                      Container(
                                        width: 100,
                                        height: 140,
                                        decoration: BoxDecoration(
                                          borderRadius: BorderRadius.circular(10),
                                          image: DecorationImage(
                                              fit: BoxFit.cover,
                                              image: NetworkImage(bookCoverURL)),
                                        ),
                                      ),
                                      Container(
                                        width: 230,
                                        //color: Colors.red,
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.center,
                                          crossAxisAlignment:
                                              CrossAxisAlignment.center,
                                          children: [
                                            Text(
                                              category.toString(),
                                              style: TextStyle(
                                                color: Colors.grey,
                                                fontStyle: FontStyle.italic,
                                              ),
                                            ),
                                            Container(
                                              margin: EdgeInsets.only(top: 10),
                                              child: Text(
                                                title.toString(),
                                                style: TextStyle(
                                                  fontWeight: FontWeight.bold,
                                                  fontSize: 17,
                                                ),
                                              ),
                                            ),
                                            Container(
                                              margin: EdgeInsets.only(top: 10),
                                              child: Text(
                                                (author),
                                                style:
                                                    TextStyle(color: Colors.grey),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                      Icon(
                                        Icons.arrow_forward_ios,
                                        color: Colors.black,
                                        size: 15,
                                      )
                                    ],
                                  ),
                                ],
                              ),
                              //color: Colors.yellowAccent,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(10.0),
                              ),
                              elevation: 5,
                              margin: EdgeInsets.all(10),
                            ),
                          );
  
                          bookWidgets.add(bookWidget);
  </code></pre>
  <p>And then I display all my code in the screen by :</p>
  <pre><code>  Column(
     children: bookWidgets,
    )
  </code></pre>
  <p><a href="https://i.stack.imgur.com/T0pfZ.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/T0pfZ.jpg" alt="The image" /></a></p>
  <p>But how can I make the app navigate to a new screen when the user pressed on a specific <code>card()</code>? Since all of them are the same widget and have no unique identifier?</p>
  <p>Any help is greatly appreciated! Thank you!</p>