moving Vue3 component snippet to Composition API

Packages/User/vue-component.sublime-snippet

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import { defineComponent } from 'vue'
+import { defineComponent, reactive, ref, computed, watch, onBeforeMount, onMounted } from 'vue'
 import AppLayout from '@/Layouts/AppLayout.vue'
 
 export default defineComponent({
@@ -23,21 +23,35 @@ export default defineComponent({
     AppLayout,
   },
 
-  setup(props, {emit}) {
-    return {}
+  setup(props, {context, emit}) {
+    let aVariable = reactive({})
+
+    let compVariable = computed(() => {
+      //return 'foo'
+    })
+
+    watch(variable, (newValue, oldValue) => {
+      //
+    })
+
+    onBeforeMount(() => {
+      //
+    })
+
+    onMounted(() => {
+      //
+    })
+
+    function myMethod() {
+      aVariable.value = null
+    }
+
+    return {
+      aVariable,
+      compVariable,
+      myMethod,
+    }
   },
-
-  beforeMount() {},
-
-  mounted() {},
-
-  data() {
-    return {}
-  },
-
-  computed: {},
-
-  methods: {},
 })
 </script>