</div>
</template>
-<script lang="ts">
+<script lang="ts" setup>
import { defineComponent, inject, computed, ref } from 'vue'
import { scrollWaiter } from './scrollWaiter'
-import { useLink, useRoute } from 'vue-router'
+import { useLink, useRoute, RouterLink } from 'vue-router'
import AppLink from './AppLink.vue'
-export default defineComponent({
- name: 'App',
- components: { AppLink },
- setup() {
- const route = useRoute()
- const state = inject('state')
- const viewName = ref('default')
+const route = useRoute()
+const state = inject('state')
+const viewName = ref('default')
- useLink({ to: '/' })
- useLink({ to: '/documents/hello' })
- useLink({ to: '/children' })
+useLink({ to: '/' })
+useLink({ to: '/documents/hello' })
+useLink({ to: '/children' })
- const currentLocation = computed(() => {
- const { matched, ...rest } = route
- return rest
- })
+const currentLocation = computed(() => {
+ const { matched, ...rest } = route
+ return rest
+})
- function flushWaiter() {
- scrollWaiter.flush()
- }
- function setupWaiter() {
- scrollWaiter.add()
- }
+function flushWaiter() {
+ scrollWaiter.flush()
+}
+function setupWaiter() {
+ scrollWaiter.add()
+}
- const nextUserLink = computed(
- () => '/users/' + String((Number(route.params.id) || 0) + 1)
- )
+const nextUserLink = computed(
+ () => '/users/' + String((Number(route.params.id) || 0) + 1)
+)
- return {
- currentLocation,
- nextUserLink,
- state,
- flushWaiter,
- setupWaiter,
- viewName,
- toggleViewName() {
- viewName.value = viewName.value === 'default' ? 'other' : 'default'
- },
- }
- },
-})
+currentLocation,
+ nextUserLink,
+ state,
+ flushWaiter,
+ setupWaiter,
+ viewName,
+ function toggleViewName() {
+ viewName.value = viewName.value === 'default' ? 'other' : 'default'
+ }
</script>
}
}
-const r = useRoute()
+function _ok() {
+ const r = useRoute()
-if (r.name === '/[name]') {
- r.params.name.toUpperCase()
- // @ts-expect-error: Not existing route
-} else if (r.name === 'nope') {
- console.log('nope')
+ if (r.name === '/[name]') {
+ r.params.name.toUpperCase()
+ // @ts-expect-error: Not existing route
+ } else if (r.name === 'nope') {
+ console.log('nope')
+ }
+
+ router.push({
+ name: '/[name]',
+ params: { name: 'hey' },
+ })
+
+ router
+ .resolve({ name: '/[name]', params: { name: 2 } })
+ .params.name.toUpperCase()
}