diff --git a/2021-07-30_composition-01-starting-setup/src/components/UserData.vue b/2021-07-30_composition-01-starting-setup/src/components/UserData.vue
index b043780..ba9a70a 100644
--- a/2021-07-30_composition-01-starting-setup/src/components/UserData.vue
+++ b/2021-07-30_composition-01-starting-setup/src/components/UserData.vue
@@ -4,12 +4,17 @@
 </template>
 
 <script>
+import { computed } from 'vue';
 export default {
   props: ['firstName', 'lastName', 'age'],
-  computed: {
-    userName() {
-      return this.firstName + ' ' + this.lastName;
-    }
+  setup(props) {
+    const userName = computed(function() {
+      return props.firstName + ' ' + props.lastName;
+    });
+
+    return {
+      userName
+    };
   }
 };
 </script>