zoukankan      html  css  js  c++  java
  • 前端路由rooter 组件(API 使用)

    路由API:
    1、引入rooter  import VRrouter from 'vue-router'  
    2、使用该组件 Vue.use(VRrouter)    Vue.user 的意义:会自动阻止多次注册相同插件,届时只会注册一次该插件。
    3、和后台开发一样 new  VRrouter 的一个对象出来 并赋予内部router 前端路由分配页面的一个属性
    4、注册该插件 在new Vue({}) 中注册该插件  router 
    5、在 app.vue 中使用该<router-view> 标签 表示:将app.vue 作为母版页,其他子页面的切换就在模板页上进行。
    6、 <router-link :to="{path:'apple'}" tag='li'> apple</router-link>  当页面切换时 可以使用<router-link> 标签 中的to属性进行跳转。
      tag 表示可以转换成什么样的dom节点  可以是li,div 等等
    <router-link> 默认是将其转换为 <a href ="xxx"> 但vue 中建议使用router-link  
    注:获取当前路径API  this.$route.path
    (后面继续学习,文章将会在后面继续迭代mark)
    let router = new VRrouter({
      mode:'history', //默认是hash   也可以指定为history 模式
      routes:[
        {
          path:'/',
          component:indexPage //首页默认页面
        },
        {
          path:'/detail',
          component:Detail,
          redirect:'/detail/count',  //访问该路由时默认显示第一个子路由
          children:[  //子路由
            {
              path:'count',
              component:countPage
            },
            {
              path:'forecast',
              component:forecastPage
            }
          ]
        }
      ]
    });
     
     
  • 相关阅读:
    运维常用python库&模块
    find&正则表达式
    博客园背景粒子连线代码
    xshell几款绝佳配色方案
    解决ssh连接超时(ssh timeout)的方法
    Java-计划存储
    @Repository、@Service、@Controller 和 @Component
    帮助对@Repository注解的理解
    Struts 2学习笔记——拦截器相关
    JAVA UUID 生成
  • 原文地址:https://www.cnblogs.com/lanSeGeDiao/p/8933984.html
Copyright © 2011-2022 走看看