使用moy快速开发后台管理系统(二)

moy是什么?

moy 是基于模型框架 keroUI 框架 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">
              ![](./static/applimanage.png)
            </div>
          </div>
        </a>
      </div>
      <!--新增应用管理 end -->
    </div>
    

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


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

请期待下一篇。

(完)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,916评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,082评论 19 139
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,267评论 4 61
  • A1便签:觉得自己太胖,想减肥 1.为什么觉得这件事情重要?夏天到了,肉藏不住了,希望自己在别人面前有一个好的形象...
    ZhouJH阅读 178评论 0 0
  • 白羊座和上升白羊座,在9月份里忙忙碌碌,为工作为健康。10月11号,木星进入了白羊座的第八宫,并且在这里待上一年多...
    星座论讯阅读 261评论 0 0