route中的fullpath和query
<!-- 注意3在this.$route中,path只是路径部分,fullPath是完整地址 -->
<!-- fullPath: "/movie/2?name=zs%20age%3D28" -->
<!-- path: "/movie/2" -->
<!-- query: {name: 'zs age=28'} -->
App2.vue
<template>
<div class="app-container">
<h1>App2 组件</h1>
<!-- 注意3在this.$route中,path只是路径部分,fullPath是完整地址 -->
<!-- fullPath: "/movie/2?name=zs%20age%3D28" -->
<!-- path: "/movie/2" -->
<!-- query: {name: 'zs age=28'} -->
<router-link to="/movie/2?name=zs age=28">电影2</router-link>
<router-view></router-view>
<hr />
</div>
</template>
index.js规则
const router = new VueRouter({
routes: [
{path:'/movie/:mid',component:Movie,props:true}
]
})
movies.vue
打印this
<template>
<div class="movie-container">
<button @click="showThis">打印this</button>
</div>
</template>
<script>
export default {
name: 'Movie',
methods:{
showThis(){
console.log(this);
}
}
}
</script>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通