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)相对坐标转世界坐标

相关内容

热门资讯

不规范视频会议可能造成敏感信息... 国家安全部今天发布安全提示文章。视频会议系统能够打破时空限制，高效又便捷，逐渐成为大家沟通工作、传递...
伊朗总统办公室主任：总统与革命... 新华社德黑兰5月5日电（记者陈霄 沙达提） 据伊朗塔斯尼姆通讯社5日报道，伊朗总统办公室主任哈吉·米...
人民日报：任何企图否定东京审判... 原标题：捍卫历史正义 维护国际秩序——写在东京审判开庭80周年之际钟 佳 黄惠康 《人民日报》（20...
中学生进大厂体验:1个月拿了1... 中学生进大厂体验:1个月拿了1.5万　　【中学生进大厂体验:1个月拿了1.5万】2024年年初，19...
多位省委书记省长会见王传福 从... 多位省委书记省长会见王传福　　【多位省委书记省长会见王传福】4月27日，河南省委书记刘宁在郑州会见比...
上海汇正财经服务费能退吗？震荡... 　　部分投资者关心上海汇正财经服务费能退吗,但在二季度A股震荡加剧、地缘与油价双重扰动的复杂环境下,...
市场稀缺权益来袭！从全球急难救... 　　现在信用卡的功能越来越细化，也越来越人性化了，比如平安银行信用卡新推出的以“一生守护 十分平安”...
美官员：美商船穿越霍尔木兹海峡... 当地时间5月5日，央视记者获悉，两艘搭载美军安全队员的美国商船在通过霍尔木兹海峡期间曾遭伊朗袭击。美...
日本参议员：对俄制裁损害日本国... 正在俄罗斯访问的日本国会参议员铃木宗男5月5日对媒体表示，日本对俄制裁同样损害了日本国家利益。铃木说...
美国务卿称美国正推进对伊朗“极... △美国国务卿鲁比奥（资料图）当地时间5月5日，美国国务卿鲁比奥在媒体简报会上称，美军正在霍尔木兹海峡...