• 一个完整的移动端项目的构建步骤——框架搭构5


    将剩余的东西补充完整——

    window.routeModule = (function() {
        //pageMap --> 页面映射存储关系表
        var pageMap = {
            home: homeModule,
            rank: rankModule,
            login: loginModule,
            citylist: cityListModule,
            formbus: form_busModule
        }
        //我为了控制每个页面进去、离开操作,我引入下面的逻辑
    
        //缓存页面存储关系表,去判断页面需不需要去重复加载
        var pageCacheMap = {
            //页面有没有被初始化的关系表
        }
    
        /*var pageObj = {
            //当前页,与前一页关系表
            current_Page: null, //当前页面
            pre_Page: null //页面的前一页
        }*/
        var current_Page = null;
        var pre_Page = null;
        //路由控制函数,它专门负责路由对应的跳转操作
        function routerControl(routeName){
            //routeName --> 传人了hash对应名字
            console.log(routeName + '发生了变化');
            //路由的核心代码
            if(pageMap[routeName]) {
                var module = pageMap[routeName];
                if(typeof pageCacheMap[routeName] === "undefined") {
                    //判断页面有没有被初始化过
                    console.log(routeName + '没有被初始化过');
                    
                    module.init();//执行相应模块初始化操作
                    module.enter(); //进入该页面
    
                    pageCacheMap[routeName] = module; //将已经初始化的模块,放入缓存关系表中
    
                    //当前页 与 前一页 进行转换操作
                    pre_Page = current_Page; //将前一页
                    
                    current_Page = module;
    
                    console.log('现在的当前页', current_Page.name);
                    if(pre_Page) {
                        console.log('现在的前一页', pre_Page.name);
                        pre_Page.leave();
                    }
    
                }else {
                    console.log(routeName + '我已经被初始化过了');
                    module.enter(); //直接把页面展示出来
                    pre_Page = current_Page;
                    current_Page = module;
                    if(pre_Page) {
                        pre_Page.leave();
                    }
                }
    
            }else {
                pageMap['home'].init();    
            }
            
            /*等价于 
            routeName = 'home'
            pageMap['home'].init();*/
        }
        //自执行函数执行完成之后它会返回一个对象
        return {
            router: routerControl
        }
        
    
    })();
  • 相关阅读:
    <!--[if IE 9]>....<!end if-->
    背景颜色设置
    UIImageView 响应UIButton的点击事件
    响应键盘return事件
    iOS 封装数据请求,解析数据(异步)
    UIImageView 圆角
    JS 控制文本框必须输入值才能查询
    MVC4 @Html.Raw()
    JS加成显示
    随机生成人物名称
  • 原文地址:https://www.cnblogs.com/thestudy/p/5627138.html
Copyright © 2020-2023  润新知