发布时间:2024/05/22
如果您有适合我的项目机会给到我,这是我的简历:Resume
思路:
思路原理:实践发现href为null或者" "的时候是不起作用的
- 将href属性绑定的固定路径设置为响应式数据变量a,a初始值为null or " "
- 利用鼠标事件之鼠标右键事件【oncontextmenu】将href绑定的变量a设置为 path路径值
- 利用鼠标事件之鼠标按下事件【mousedown】将a的值先设置为null or " ",这时候href就不起作用了,再利用vue-router的push方式实现路由跳转。
友情提示:我的代码特殊性在于用的route模式是hash 不是传统的history 且使用是vue3和typescript,读者自行调试,思路是没问题的。
代码:
html
<a
@contextmenu="contextmenu(item)"
@mousedown="menuItemMouseDown(item)"
:href="a"
>
{{ item.meta.title }}
</a>
typescript or javascript
const a = ref("");//将设置为响应式数据
const menuItemMouseDown = (item: any) => {
a.value = "";//先将a设置为空
router.push(item.path);//在通过vue-router 的push方法实现内部路由跳转
};
const contextmenu = (item: any) => {
a.value = "/#/" + item.path;
};