basic routing for roomview

front/src/views/room/RoomView.vue

@@ -1,26 +1,30 @@
+<script setup>
+  import { useRoute } from "vue-router"
+  import { onBeforeMount } from "vue"
+  import Header from './Header.vue'
+
+  const route = useRoute();
+
+  onBeforeMount(() => {
+    // get data
+  });
+
+  const { id } = route.params;
+
+</script>
+
 <template>
     <div>
         <Header></Header>
         <div>
-           
             Room
             is thread
+            <b>{{ id }}</b>
         </div>
 
     </div>
 </template>
 
-<script>
-import Header from './Header.vue'
-
-export default {
-  name: 'RoomView',
-  components: {
-    Header
-  }
-}
-</script>
-
 <style scoped>
 div {
     background-color: #1D1D23;