使用moy快速开发后台管理系统（二）

[HuYuee]

moy是什么？

moy 是基于模型框架 kero 和 UI 框架 neoui 实现的应用框架，是前端集成解决方案，为企业级应用开发而生。
github地址：https://github.com/iuap-design/tinper-moy

step 2. 实现路由切换页面展示

1. 注册路由：在router/router.js文件中替换为如下代码：

   define(function() {
       return [{
           name: "/mainPage/main"
       }, {
           name: "/cardtable/cardtable"
       }]
   });

2. 在左侧栏添加入口：在index.html中加入新增应用管理入口代码：

   <ul class="nav-menu height-full" id="menu">
     <!-- 原有代码请勿拷贝 -->
     <li class='nav-li'>
       ...
     </li>
     <!-- 新增应用管理入口代码 begin -->
     <li class='nav-li'>
       <!-- a标签地址要指向到你想去的页面的路由地址 -->
       <a href="#cardtable/cardtable">
         <i class="uf uf-4square-3"></i>
         <span class="nav-title">应用管理</span>
       </a>
     </li>
     <!-- 新增应用管理入口代码 end -->
   </ul>

3. 在首页添加入口：在pages/mainPage/main.html中加入新增应用管理代码：

   <div class="u-row bottom-layout margin-0">
     <!-- 原有代码请勿拷贝 -->
     <div class="u-col-xs-6 u-col-md-3 content">
       ...
     </div>
     <!--新增应用管理 begin -->
     <div class="u-col-xs-6 u-col-md-3 content">
       <a href="#cardtable/cardtable">
         <div class="u-form-group">
           <div class="u-col-xs-12 content-svg">
             <img src="./static/applimanage.png">
           </div>
         </div>
       </a>
     </div>
     <!--新增应用管理 end -->
   </div>

这个时候在浏览器刷新下页面，点击左侧栏的应用管理，这个时候地址栏变成了http://localhost:8080/#cardtable/cardtable，页面一片空白，到这里，这一步已经完成了

---

到这里，我们已经完成了前面的准备工作，后面我会开始写如何去实现grid表格数据展示和分页

请期待下一篇。

(完)