在vue3中,对一个画面新建一个下级空白页,并在触发点击事件时,跳转到空白页上
时间: 2023-05-17 16:07:57 浏览: 145
在Vue3中,您可以使用Vue Router来实现这个功能。首先,您需要在Vue项目中安装Vue Router。然后,您可以在Vue组件中使用router-link组件来创建一个链接到空白页的链接。在点击事件中,您可以使用router.push方法来导航到空白页。以下是一个示例代码:
<template>
<div>
<router-link to="/blank-page">新建空白页</router-link>
<button @click="goToBlankPage">跳转到空白页</button>
</div>
</template>
<script>
import { defineComponent } from 'vue'
import { useRouter } from 'vue-router'
export default defineComponent({
name: 'MyComponent',
setup() {
const router = useRouter()
const goToBlankPage = () => {
router.push('/blank-page')
}
return {
goToBlankPage
}
}
})
</script>
请注意,您需要在Vue Router中定义一个名为“blank-page”的路由,以便能够导航到空白页。
阅读全文