Vue的router-view

点击链接跳转到其他组件，通常会跳转到新的页面，如果不想跳转到新页面，只在当前页面切换着显示，那么就要涉及到路由的嵌套了，也可以说是子路由的使用。

我的订单页面：mAccount.vue

<template>
  <div id="main">
    <div class="content clear">
      <div class="account-wrapper">
        <!-- 页面左侧 -->
        <div class="account-sidebar">
          <div class="avatar gray-box clear">
            <div class="js-account-sidebar-info">
              <img src="http://static.smartisanos.cn/account/asset/img/default-user-avatar.png">
            </div>
            <div class="box-inner">
              <ul class="account-nav">
                <li class="current"><a href="javascript:;">我的订单</a></li>
                <li class=""><a href="javascript:;">收货地址</a></li>
              </ul>
            </div>
          </div>
        </div>
        <!-- 嵌套路由 --><!-- 页面右侧 -->
        <router-view></router-view>
      </div>
    </div>
  </div>
</template>

路由配置  index.js

{
      path: '/MAccount',
      component: MAccount,
      children:[{
        path: '',
        name:'MAccount',
        /* 对应order页面 */
        component: Order
      }]
    }