打开新页面

pushWindow 用于在同一个离线包内打开一个新的页面，打开时自带系统转场动画。若您需要跨 appId 打开其他离线应用页面，请使用 startApp 接口。

pushWindow 与前端 location.href 的区别，类同于 PC 浏览器的新开标签页，每个 window 都是一个新的标签页，因此原页面仅仅是被压到后台，状态始终保持，JS 也会继续运行。

pushWindow 接口的使用方法

// 打开淘宝首页，自动读取 title，并且去除右边菜单按钮
AlipayJSBridge.call('pushWindow', {
  url: 'https://m.taobao.com/', // 要打开页面的 URL
  // 打开页面的配置参数
  param: {
    readTitle: true,    //自动读取 title
    showOptionMenu: false    // 隐藏右边菜单
  },
  // 用于给新开的页面传递参数，可选
  // 在新开的页面使用 AlipayJSBridge.startupParams 可以获取到 passData
  passData: {
    key1: "key1Value",
    key2: "key2Value"
  }
});

代码示例

• 打开淘宝首页，去除右边菜单。

  <h1>打开淘宝首页</h1>
  <a class="btn J_demo">执行</a>
  <script>
  function ready(callback) {
    // 如果 jsbridge 已经注入则直接调用
    if (window.AlipayJSBridge) {
        callback && callback();
    } else {
        // 如果没有注入则监听注入的事件
        document.addEventListener('AlipayJSBridgeReady', callback, false);
    }
  }
  ready(function(){
    document.querySelector('a').addEventListener('click', function() {
        // 打开淘宝首页，自动读取 title，并且去除右边菜单
        AlipayJSBridge.call('pushWindow', {
            url: 'https://m.taobao.com/',
            param: {
                readTitle: true,
                showOptionMenu: false
            }
        });
    });
  });
  </script>

• 打开时设置透明标题栏。

  <h1>打开淘宝首页</h1>
  <a class="btn J_demo">执行</a>
  <script>
  function ready(callback) {
  // 如果 jsbridge 已经注入则直接调用
  if (window.AlipayJSBridge) {
    callback && callback();
  } else {
    // 如果没有注入则监听注入的事件
    document.addEventListener('AlipayJSBridgeReady', callback, false);
  }
  }
  ready(function() {
  document.querySelector('a').addEventListener('click', function() {
    AlipayJSBridge.call('pushWindow', {
      url: 'https://m.taobao.com',
      param: {
        transparentTitle: 'auto'
      }
    });
  });
  });
  </script>

API

AlipayJSBridge.call('pushWindow', {
    url, param, passData
})

入参

param 参数详解

pushWindow 参数默认继承

pushWindow 和 location.href 的区别

您可以根据以下内容理解 pushWindow 和 location.href 的区别：

• 首先把 Nebula 容器理解为一个 PC 浏览器。
• window 可以理解为标签页；location.href 就是正常的标签跳转。
• pushWindow 实际上就是新开了一个标签页，并且把之前那一页压到下面，push 出来的这页放在顶层展现。此时被压到下面的上一页所有状态均保留。
• location.href 就是依然停留在这个标签页，直接做页面跳转。
• 当 pushWindow 出来的标签页被关闭（pop）时，如果之前还有 window 存在，那么之前那个 window 就会恢复显示，并触发 resume。

注意事项

• pushWindow 打开 URL 页面的时候不会关闭已经存在的页面，注意打开个数，不要开太多影响性能。建议同一个应用 pushWindow 层级不要超过 5 层，否则会影响用户体验而且有可能导致应用 crash。