vue 路由跳转到其他页面指定位置(锚点)

首先在指定的位置增加一个锚点(要被跳转的页面)

<div id='main'></div>

我们要跳转的时候,其实在路由后面拼接一个#main  就可以了

下面是没有锚点,要准备点击后跳转的页面

<div class="" @click="goTo('/Market#market')">每日价格</div>
goTo(path) {
      window.open(path, "_blank");
    },

然后在被跳转的页面增加一下代码

也就是有锚点的页面:

mounted() {
    const hash = this.$route.hash;
    if (hash) {
      const position = document.getElementById(hash.substring(1));
      if (position ) {
        position .scrollIntoView();
      }
    }
  },

相关推荐

  1. vue 其他页面指定位置

    2023-12-05 17:50:11       53 阅读
  2. Vue3 setup 页面监听变化调整页面访问位置

    2023-12-05 17:50:11       104 阅读
  3. react/vue文章指定位置简单demo

    2023-12-05 17:50:11       189 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-05 17:50:11       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-05 17:50:11       100 阅读
  3. 在Django里面运行非项目文件

    2023-12-05 17:50:11       82 阅读
  4. Python语言-面向对象

    2023-12-05 17:50:11       91 阅读

热门阅读

  1. kafka kraft 集群搭建保姆级教学 包含几个踩坑点

    2023-12-05 17:50:11       57 阅读
  2. Spring Boot 统⼀数据返回格式

    2023-12-05 17:50:11       53 阅读
  3. IntelliJ IDEA详细完整安装教程

    2023-12-05 17:50:11       47 阅读
  4. 智慧城市大脑,运维无忧!

    2023-12-05 17:50:11       68 阅读
  5. 【鸿蒙应用开发】开发环境搭建及IDE安装使用

    2023-12-05 17:50:11       69 阅读
  6. AR增强现实在汉语文学课堂教学中的应用

    2023-12-05 17:50:11       51 阅读
  7. 亚马逊首席技术官2024年科技预测

    2023-12-05 17:50:11       45 阅读
  8. 你了解Redis 的二进制安全吗

    2023-12-05 17:50:11       57 阅读
  9. 面阵相机通用接口

    2023-12-05 17:50:11       52 阅读