From 5e7a52d981ce3cc0e1b39f43db220ad3416df64f Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Tue, 9 Aug 2022 21:10:05 +0400
Subject: [PATCH] Add rendering lists docs

---
 .../content/100-fundamental-topics/106-rendering-lists.md | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/106-rendering-lists.md b/content/roadmaps/105-vue/content/100-fundamental-topics/106-rendering-lists.md
index 8c7e28e35..002d41df0 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/106-rendering-lists.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/106-rendering-lists.md
@@ -1 +1,7 @@
-# Rendering lists
\ No newline at end of file
+# Rendering Lists
+
+We can use the `v-for` directive to render a list of items based on an array. The `v-for` directive requires a special syntax in the form of `item in items`, where `items` is the source data array and `item` is an alias for the array element being iterated on.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://vuejs.org/guide/essentials/list.html'>Rendering Lists in Vue.js</BadgeLink>
+