在 Vue.js 中,您可以使用
$route
对象来获取当前路由信息。
$route
对象是 Vue.js 内置的路由对象,它包含了当前路由的一些信息,例如当前路由的路径、参数、查询参数等等。
您可以通过
this.$route
来访问
$route
对象,然后获取需要的信息。
以下是一些常用的路由信息属性:
$route.path
:当前路由的路径
$route.params
:当前路由的参数对象,例如在路由定义中声明了
:id
参数,那么在组件中就可以通过
$route.params.id
来获取该参数的值。
$route.query
:当前路由的查询参数对象,例如
/search?q=vue
中的
q
参数,可以通过
$route.query.q
来获取。
$route.fullPath
:当前路由的完整路径,包括路径和查询参数。
下面是一个简单的例子,演示了如何在 Vue.js 中获取路由信息:
<template>
<h2>当前路由信息</h2>
<p>路径:{{ $route.path }}</p>
<p>参数:{{ $route.params.id }}</p>
<p>查询参数:{{ $route.query.q }}</p>
<p>完整路径:{{ $route.fullPath }}</p>
</template>
<script>
export default {
name: 'MyComponent',
mounted () {
console.log(this.$route.path) // 打印当前路由的路径
console.log(this.$route.params.id) // 打印当前路由的 id 参数
console.log(this.$route.query.q) // 打印当前路由的查询参数 q
console.log(this.$route.fullPath) // 打印当前路由的完整路径
</script>
希望这些信息对您有所帮助。如果您还有其他问题,请随时提问。