美文网首页
vue-router集成

vue-router集成

作者: littlesiqi | 来源:发表于2017-12-22 01:22 被阅读0次
    1. 安装vue-router
      npm install vue-router --save

      1. App.vue中书写跳转链接

      <router-link to="/login">登录</router-link>
      <router-link to="/register">注册</router-link>


      <router-view></router-view>

      1. main.js中集成vue-router并配置路由规则

      // 1. 导入vue-router
      import vueRouter from 'vue-router';
      // 2. 将vueRouter对象绑定到Vue对象上
      Vue.use(vueRouter);

      // 3. 导入路由规则对应的组件对象
      import login from './components/account/login.vue';
      import register from './components/account/register.vue';

      // 4.定义路由规则
      var router1 = new vueRouter({
      routes:[
      {path:'/login',component:login},
      {path:'/register',component:register}
      ]
      });

      // 5. 利用Vue对象进行解析渲染
      new Vue({
      el:'#app',
      // 使用路由对象实例
      router:router1,
      render:c=>c(App)
      });

    相关文章

      网友评论

          本文标题:vue-router集成

          本文链接:https://www.haomeiwen.com/subject/inozwxtx.html