diff --git a/src/components/MailTable.vue b/src/components/MailTable.vue
index 950efa9..e974d6b 100644
--- a/src/components/MailTable.vue
+++ b/src/components/MailTable.vue
@@ -21,13 +21,14 @@
 
 <script>
   import { format } from 'date-fns';
+  import { ref } from 'vue';
 
   export default {
     async setup(){
       await new Promise(resolve => setTimeout(resolve, 3000))
       return {
         format,
-        "emails": [
+        "emails": ref([
           {
             "id": 1,
             "from": "team@vuemastery.com",
@@ -64,7 +65,7 @@
             "archived": true,
             "read": false
           }
-        ]
+        ])
       }
     },
     computed: {