文档中心 > API

页面导航

更新时间：2017/08/15 访问次数：5683

页面导航

页面导航用于控制页面的打开、返回、刷新、关闭等功能

API 调用

QN.navigator.push(options) / QN.navigator.go(options)

打开/跳转页面

API 调用入参

参数名 类型 是否可选 默认值 含义
options Object 选项
options.url String 需要跳转的URL
options.title Object 可选 新页面的 title
options.query Object 可选 跳转到 URL 时要传递的 query 参数
options.settings Object 可选 设置项
options.settings.animate Boolean 可选 false 切换时是否启用动画效果
options.settings.clearTop Boolean 可选 false 新开页面后，是否关闭除了新页面之外的所有其他页面
options.settings.resolveURL Boolean 可选 true 在 H5 页面中 push 新页面的时候，是否自动解析 URL
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数
  • options.settings.resolveURL
    • 当在 H5 页面中 push 新页面时，如果 push 的是 qap:// 协议的页面，会自动根据 qap.json 中的 WebRootPath 字段将 url 解析成 http:// 对应的页面。如果你不希望进行自动解析，可以将 resolveURL 的值设置为 false。

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

QN.navigator.push({
    url: 'https://work.taobao.com',
    title: '新开页面标题~~',
    query: { x: 1, y: 2 },
    settings: {
        animate: true,
        request: true,
    }
}).then(result => {
    console.log(result);
}, error => {
    console.log(error);
});

QN.navigator.push({
    url: 'https://work.taobao.com',
    title: '新开页面标题~~',
    query: { x: 1, y: 2 },
    settings: {
        animate: true,
        request: true,
    },
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

QN.navigator.pop(options) / QN.navigator.back(options)

关闭页面/后退

API 调用入参

参数名 类型 是否可选 默认值 版本支持 含义
options Object 可选 {} 选项
options Number 可选 1 iOS >= 6.0.2
Android >= 6.0.1 		要关闭的页面数量
options.query Object 可选 接口调用参数
options.query.pages Number 可选 1 要关闭的页面数量
options.settings Object 可选 设置项
options.settings.animate Boolean 可选 切换时是否启用动画效果
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

// 关闭当前页面
QN.navigator.pop()
    .then(result => {console.log(result);})
    .catch(error => {console.log(error);})

// 关闭3个页面
QN.navigator.pop(3)
    .then(result => {console.log(result);})
    .catch(error => {console.log(error);})

// 传入设置项
QN.navigator.pop({
    query: {pages: 3},
    settings: {animate: true},
}).then(result => {
    console.log(result);
}).catch(error => {
    console.log(error);
})

// 回调函数形式
QN.navigator.pop({
    query: {pages: 3},
    settings: {animate: true},
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

QN.navigator.popTo(options) / QN.navigator.backTo(options)

后退页面到指定索引或URL的页面

API 调用入参

参数名 类型 是否可选 默认值 版本支持 含义
options Object 可选 {} 选项
options Number 可选 iOS >= 6.0.2
Android >= 6.0.1 		要后退到第几个页面
options String 可选 iOS >= 6.0.2
Android >= 6.0.1 		要后退到的页面URL
options.query Object 可选 接口调用参数
options.query.index Number 可选 iOS >= 6.0.2
Android >= 6.0.1 		要后退到第几个页面，从 0 开始，优先级高于 url
options.query.url Number 可选 iOS >= 6.0.2
Android >= 6.0.1 		要后退到的页面URL
options.settings Object 可选 设置项
options.settings.animate Boolean 可选 切换时是否启用动画效果
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数
  • popTo(url)：
    • url的匹配只匹配到 path 部分，不会匹配 search 参数和 hash。
    • 如果页面栈中包含多个url匹配的页面，则会后退到第一个匹配的页面。
  • 如果 index 和 url 同时传递，则以 index 优先。

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

// 后退到第 1 个页面，假设页面栈为 [0, 1, 2, 3]
QN.navigator.popTo(1)
    .then(result => {console.log(result);})
    .catch(error => {console.log(error);})

// 后退到 url 为 `qap:///home.js` 的页面
QN.navigator.popTo('qap:///home.js')
    .then(result => {console.log(result);})
    .catch(error => {console.log(error);})

// 传入设置项
QN.navigator.popTo({
    query: {index: 1},
    settings: {animate: true},
}).then(result => {
    console.log(result);
}).catch(error => {
    console.log(error);
})

QN.navigator.popTo({
    query: {url: 'qap:///home.js'},
    settings: {animate: true},
}).then(result => {
    console.log(result);
}).catch(error => {
    console.log(error);
})

// 回调函数形式
QN.navigator.popTo({
    query: {index: 1},
    settings: {animate: true},
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

QN.navigator.reload(options);

刷新当前页面

API 调用入参

参数名 类型 是否可选 默认值 含义
options Object 可选 {} 选项
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

QN.navigator.reload();

QN.navigator.reload()
.then(result => {
    console.log(result);
}, error => {
    console.log(error);
});

QN.navigator.reload({
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

QN.navigator.close(options);

关闭插件应用

API 调用入参

参数名 类型 是否可选 默认值 含义
options Object 可选 选项
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

QN.navigator.close();

QN.navigator.close()
.then(result => {
    console.log(result);
}, error => {
    console.log(error);
});

QN.navigator.close({
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

QN.navigator.setSwipeBack(options)

启用/禁用iOS下页面的左滑返回，页面加载时默认为启用。

API 调用入参

参数名 类型 是否可选 默认值 含义
options Object 选项
options.query Object 可选 接口调用参数
options.query.enable Boolean 可选 是否启用左滑返回
options.success Function 可选 调用成功的回调函数
options.error Function 可选 调用失败的回调函数

API 响应结果

参数名 类型 是否必须返回 含义
result Object 响应对象
result.code String 错误码，成功为 QAP_SUCCESS；失败为其他
result.msg String 错误信息

调用示例

// 禁止左滑返回
QN.navigator.setSwipeBack({
    query: {enable: false}
}).then(result => {
    console.log(result);
}, error => {
    console.log(error);
});

QN.navigator.setSwipeBack({
    query: {enable: false},
    success(result) {
        console.log(result);
    },
    error(error) {
        console.log(error);
    }
});

FAQ

关于此文档暂时还没有FAQ
有用(0) 我要提问
返回
顶部
阿里巴巴集团 | 淘宝网 | 天猫 | 聚划算 | 全球速卖通 | 阿里巴巴国际交易市场 | 1688 | 阿里妈妈 | 阿里旅行·去啊 | 阿里云计算 | YunOS | 阿里通信 | 万网 | 高德 | 优视 | 友盟 | 酷盘 | 虾米 | 天天动听 | 来往 | 钉钉 | 11Main | 支付宝
关于淘宝 合作伙伴 营销中心 联系客服 开放平台 诚征英才 联系我们 网站地图 法律声明 © 2016 Taobao.com 版权所有
网络文化经营许可证：文网文[2010]040号 | 增值电信业务经营许可证：浙B2-20080224-1 | 信息网络传播视听节目许可证：1109364号