vue中的Router-link怎么用
admin
2023-02-16 17:40:03
0次

简介

Vue 是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，方便与第三方库或既有项目整合。

 组件支持用户在具有路由功能的应用中（点击）导航。 通过 to 属性指定目标地址，默认渲染成带有正确链接的  标签，可以通过配置 tag 属性生成别的标签.。另外，当目标路由成功激活时，链接元素自动设置一个表示激活的 CSS 类名。

前端采用前后端分离的方式进行开发，我们使用vue2.0框架，做单页面应用难免会用到vue-router

在main.js入口文件配合vue-router写下：

router.afterEach((to,from,next) => {

    if(router.history.current.path==="/Home/Study"){
        console.log("不滚动到顶部");
    }else{
        window.scrollTo(0,0);
    }

})

        //下面是：将所有不需要回到顶部的router定义在一个数组中，来判断

        var routerArr = ["/Home/Study", "/Home/Food"]

        router.afterEach((to,from,next) => {

        // console.log(routerArr.indexOf(router.history.current.path))

            //小于0说明在数组中找不到其索引值，即其不在此数组中。
            if(routerArr.indexOf(router.history.current.path)<0){
                window.scrollTo(0,0);
            }else{
                console.log("不滚动到顶部");
            }

        })

上一篇：Web前端学习要注意哪些

下一篇：COCOS CREATOR(TS)相对坐标转世界坐标

相关内容

热门资讯

尺素金声｜中国经济“失速论”站... 一季度GDP同比增长5.0%、二季度增长4.3%、上半年增长4.7%，2026年中国经济半年报发布后...
NVIDIA最深的护城河要凉！... 7月24日消息，AMD在Advancing AI预简报会上表示，CUDA已不再是外界想象中的那条护城...
廖杰远：三大智能体协同闭环，A... 中国日报网7月24日电 7月22日，在2026年世界互联网大会数字丝路发展论坛数智健康分论坛上，微医...
AI时代构筑超级底座 维谛技术... 文/本报记者 当前，人工智能产业竞争持续向产业链上游延伸，算力竞争早已不再局限于计算芯片性能比拼。具...
刚签核协议不到24小时，美国突... 美国东部时间7月22日下午，美国宣布与沙特阿拉伯签署了一项民用核能协议。据美国有线电视新闻网（CNN...
中国信通院牵头，数据编织国际标... IT之家 7 月 24 日消息，中国信通院今日发文称，国际电信联盟第 21 研究组（ITU-T SG...
国内首颗商业空间碎片监测卫星发... 【国内首颗商业空间碎片监测卫星发射成功】《科创板日报》24日讯，7月24日上午，中科宇航力箭一号运载...
邓煜，诗人，数学家，老二次元 来源 视觉中国菲尔兹奖的通知邮件抵达时，普林斯顿大学数学博士、芝加哥大学数学系教授邓煜正在看一本恋爱...
安全生产许可证状态不是“有效”... 工程公司的安全生产许可证在官方系统显示为“其他”状态，有一栏则显示“整改”，却成为高标准农田项目的第...
深化产教融合 推进数智育人 哈... 7月23日，由阿里国际人工智能人才孵化中心（以下简称“阿里国际AITIC”）主办的“智启未来·数智赋...