28 lines
943 B
Vue
28 lines
943 B
Vue
<template>
|
|
<main class="app">
|
|
<nav class="nav">
|
|
<router-link to="/" class="nav-link">Home</router-link>
|
|
<router-link to="/players" class="nav-link" :class="{ active: route.path === '/players' }">
|
|
Page 1: Players</router-link>
|
|
<router-link to="/start" class="nav-link" :class="{ active: route.path === '/start' }">
|
|
Page 2: Start</router-link>
|
|
<router-link to="/text" class="nav-link" :class="{ active: route.path === '/text' }">
|
|
Page 3: Text</router-link>
|
|
</nav>
|
|
<section class="page-content">
|
|
<Players v-if="route.path === '/players'" />
|
|
<Start v-else-if="route.path === '/start'" />
|
|
<Text v-else-if="route.path === '/text'" />
|
|
</section>
|
|
</main>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useRoute } from 'vue-router'
|
|
import Players from './Players.vue'
|
|
import Start from './Start.vue'
|
|
import Text from './Text.vue'
|
|
|
|
const route = useRoute()
|
|
</script>
|