zoukankan      html  css  js  c++  java
  • VUE—Router的常用知识点(简单介绍)

    VUE—Router的常用知识点(简单介绍)

    一、动态路由

    在routers(定义路由) 中path:'/user/:id',其中的id就是动态路由的标志。

    上面表达所有的/user/****路由都会映射到相同的路径上,也就是说会访问到同一个页面。

    二、嵌套路由

    简单的理解就是父子路由,一个普通的路由中写

    children:[
    {
    path:'',
    component:
    }
    ]
    

    三、路由跳转方式

    编程式路由

    router.push()

    单击

    <router-link :to="..."> 
    

    等同于 router.push(...)

    router.replace() : 刷新当前路由,与router.push很像,唯一不同就是,它不会向history添加新记录,而是自动替换掉当前的history记录。 等同于

    <router-link :to="" replace>
    

    router.go(n): 方法的的参数是一个整数,意思是在history记录中前进或者后退多少,类似于window.history.go(n)

    router.go(1) : 前进一步

    router.go(-1): 后退一步

    路由跳转的时候可以传递参数,两种传参方式

    编程式路由的传参方式
    命名路由 (params)

    router-push({ name:'名称', params:{参数名:参数值}})

    声明式路由导航:

    <router-link :to="{name:'',params:{参数名:参数值}}"></router-link>
    
    查询参数(query)

    router-push({path:’值‘, query:{参数名:参数值} })

    这里需要注意的是params中只能使用name,不能使用path,而query中,都可以使用。

    想要在另一个界面获取参数,可以使用: $route.params.参数名 来进行获取,参数查询的方式也是一样的。

    声明式路由写法如上

  • 相关阅读:
    union 和 union all 区别
    sql 日期类型空值等于 1900-01-01
    IDENTITY_INSERT 自增开关使用
    Convert.ToDateTime() 与 DateTime.TryParse()区别
    SOLID 原则摘录
    不同JavaScript 代码段 变量作用域
    sql 常见错误总结
    jquery.form插件 提交表单 type="hidden"取不到值的问题记录
    同义词
    SQL优化传送门
  • 原文地址:https://www.cnblogs.com/AFBF/p/14906170.html
Copyright © 2011-2022 走看看