Eros框架下页面跳转的实现

Eros 框架中提供了两种实现跳转的方式：

一. 通过路由的固定接口实现跳转--------$router.open：跳转到一个页面

      代码实现以及相关参数的的介绍： 

 this.$router.open({
     /**
      * params: Object 类型，需要传递的参数
      */
      params: {
          test: '测试'
      },

     /**
      * name： String 类型，在路由中配置的别名
      * 例如：'hello': {url: '/pages/test/hello.js'},
      *  'hello2': {url: '/pages/test/hello2.js'}
      *  前页面为hello页面，跳转页面为hello2界面
      */
      name: 'hello2',

     /**
      * type: 页面打开方式，默认是PUSH
      * PUSH: 从右侧打开
      * PRESENT： 从底部弹出
      */
      type: "PUSH",

      /**
       * navShow： 是否显示导航条（标题栏），如果自己定义可选择隐藏
       * 类似于标题栏并且带有返回箭头
       * true: 显示导航条， false: 不显示导航条
       */
       navShow: true,

      /**
       * navTitle： String类型，导航条的显示title，；
       * 如果选择了不显示导航条，可忽略
       */
       navTitle: "传说",

       /**
        * canBack：跳转到目标页后是否可以返回；
        * true: 可以返回， 如果启用了backCallback，则返回无效
        * false:不可以返回--导航栏的返回箭头会消失，但是物理返回按钮处于有效状态，
        *       如果启用了backCallback，则返回无效
        */
        canBack: false,

       /**
        * gesback: 是否支持手势返回，默认开启仅支持IOS
        */
        gesBack: true,

       /**
        * backCallback: 返回该界面时触发该方法
        * 当该方法触发后，已跳转界面（hello2界面）不会消失，依然处于显示状态，
        * 也就是说 backCallback方法触发时，会禁用返回功能
        * 如果需要继续返回，需要执行this.$router.back({})方法
        * @param result
        */
        backCallback: result => {
             this.$router.back({
                  type: 'PRESENT'
             })
        },

       /**
        * backgroudColor: 原生页面背景颜色（可以通过设置页面背景色，感官上页面不会白屏）
        *  ----不知道有啥具体作用----
        */
        backgroudColor: '#000000',

       /**
        * statusBarStyle: String类型， 状态栏(电量，信号)样式
        * Default黑色。
        * LightContent 白色。
        */
        statusBarStyle:'LightContent'
});

 二. 通过Eros框架已有的 ‘bmRouter’中的open(params, JSCallback backCallback, JSCallBack resultCallback)方法进行跳转

     相关源码以及对应的参数和使用方法：

weex.requireModule('bmRouter').open({
     /**
      * url： router中配置的url路径
      *   在路由中配置的别名
      *   例如：'hello': {url: '/pages/test/hello.js'},
      *  'hello2': {url: '/pages/test/hello2.js'}
      *   前页面为hello页面，跳转页面为hello2界面
      */
      url:'/pages/test/hello2.js',

      /**
       * type: 页面打开方式，默认是PUSH
       *  PUSH: 从右侧打开
       *  PRESENT： 从底部弹出
       */
       type:'PRESENT',
       /**
        * params: Object 类型，需要传递的参数
        */
       params:{},
       /**
        * canBack：跳转到目标页后是否可以返回；
        * true: 可以返回， 如果启用了isRunBackCallback，则返回无效
        * false:不可以返回,不受isRunBackCallback 的影响
        */
       canBack:true,
       /**
        * navShow： 是否显示导航条（标题栏），如果自己定义可选择隐藏
        * 类似于标题栏并且带有返回箭头
        * true: 显示导航条， false: 不显示导航条
        */
        navShow:false,
       /**
        * navTitle： String类型，导航条的显示title，；
        * 如果选择了不显示导航条，可忽略
        */
        navTitle:'这是一个未来',
       /**
        * statusBarStyle: String类型， 状态栏(电量，信号)样式
        * Default黑色
        * LightContent 白色。
        */
       statusBarStyle:'LightContent',

       /**
        * backgroudColor: 原生页面背景颜色（可以通过设置页面背景色，感官上页面不会白屏）
        *  ----不知道有啥具体作用----
        */
       backgroundColor:'#f7f7f7',
       /**
        * 是否启用backCallback
        * true: 启用backCallback
        * false: 禁用backCallback
        */
       isRunBackCallback:true
       }, backCallback => {
           /**
            * backCallback: 返回该界面时触发该方法
            * 当该方法触发后，已跳转界面（hello2界面）不会消失，依然处于显示状态，
            * 也就是说 backCallback方法触发时，会禁用返回功能
            * 如果需要继续返回，需要执行this.$router.back({})方法
            *
            * 该方法受isRunBackCallback的限制
            */
            this.$router.back({
                 type: 'PRESENT'
             })
       }, resultCallback => {
           /**
            * 打开界面的结果回调
            * 回调内容： 打开页面成功/打开页面失败
            */
      });

两种方案： 策略相同，参数意义略有不同； 第二种有返回的回调； 可根据具体的开发情形选择对应的策略方式；