moy是什么?
moy
是基于模型框架 kero
和 UI
框架 neoui
实现的应用框架,是前端集成解决方案,为企业级应用开发而生。
github地址:https://github.com/iuap-design/tinper-moy
step 2. 实现路由切换页面展示
-
注册路由:在
router/router.js
文件中替换为如下代码:define(function() { return [{ name: "/mainPage/main" }, { name: "/cardtable/cardtable" }] });
-
在左侧栏添加入口:在
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>
-
在首页添加入口:在
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表格数据展示和分页
请期待下一篇。
(完)