基本格式:
//壓棧跳轉(zhuǎn)到: xxx頁(yè)面
var navigator = require('@weex-module/navigator')
.......
onItemClick:function(e){
var params = {'url':nextUrl,'animated':'true'}
navigator.push(params, function(e) {
console.log('i am the callback.')
});
}
- params設(shè)置路由 (同時(shí)包括傳值) 和是否執(zhí)行動(dòng)畫(huà)
- navigator.push (params, callback)
- 注意: animated只支持字符串 " true" or "false", 官網(wǎng)說(shuō)之后會(huì)修復(fù)
//出棧: 跳轉(zhuǎn)回: xxx頁(yè)面
var navigator = require('@weex-module/navigator')
var params = {
animated: 'true'
}
navigator.pop(params, function () {
// callback
})
由于需要url, 我們的url有很大部分是重復(fù)的, 官方給了一個(gè)截取的方法
//api.js
exports.getBaseUrl = function (bundleUrl, isnav) {
bundleUrl = new String(bundleUrl);
var nativeBase;
var isAndroidAssets = bundleUrl.indexOf('file://assets/') >= 0;
var isiOSAssets = bundleUrl.indexOf('file:///') >= 0 && bundleUrl.indexOf('WeexDemo.app') > 0;
if (isAndroidAssets) {
nativeBase = 'file://assets/dist/';
}
else if (isiOSAssets) {
nativeBase = bundleUrl.substring(0, bundleUrl.lastIndexOf('/') + 1);
}
else {
var host = 'localhost:12580';
var matches = /\/\/([^\/]+?)\//.exec(bundleUrl);
if (matches && matches.length >= 2) {
host = matches[1];
}
//此處需注意一下,tabbar 用的直接是jsbundle 的路徑,但是navigator是直接跳轉(zhuǎn)到新頁(yè)面上的.
// in Browser or WebView
if (typeof window === 'object') {
nativeBase = isnav ? 'http://' + host + '/index.html?page=./dist/' : '/dist/';
} else {
nativeBase = 'http://' + host + '/dist/';
}
}
return nativeBase;
};
我們使用的時(shí)候. 可以現(xiàn)獲取當(dāng)前的url, 然后調(diào)用上面的方法, 截取出來(lái)基本的路徑
//可以在created時(shí)運(yùn)行, 直接獲取到url
var self = this;
var base = apis.getBaseUrl(self.$getConfig().bundleUrl, true);
this.baseURL = base;
this. $getConfig().bundleUrl 可以獲取當(dāng)前的Url
使用時(shí):
openSerialDetail: function (id) {
var vm = this;
var params = {
'url': this.baseURL + 'modules/serial-detail.js?id=' + id,
'animated': 'true'
};
navigator.push(params, function (e) {
//callback
});
},
可以看到,路徑url拼接 , 和傳值,
注意:
- url拼接是編譯后的地址和文件 (serial-detail.js 而不是 serial-detail.we)
- naviagtor會(huì)直接跳轉(zhuǎn)到這個(gè)文件生成的頁(yè)面上
$getConfig()的其他用法: 獲取當(dāng)前全局環(huán)境變量和配置信息抽米。
- config (object): 配置對(duì)象梗劫；
- bundleUrl (string): bundle 的 url衙传；
- debug (boolean): 是否是調(diào)試模式肚邢；
- env (object): 環(huán)境對(duì)象忍疾；
- weexVersion (string): Weex sdk 版本；
- appName (string): 應(yīng)用名字；
- appVersion (string): 應(yīng)用版本；
- platform (string): 平臺(tái)信息康二，是 iOS、Android 還是 Web勇蝙；
- osVersion (string): 系統(tǒng)版本沫勿；
- deviceModel (string): 設(shè)備型號(hào) （僅原生應(yīng)用）；
- deviceWidth (number): 設(shè)備寬度，默認(rèn)為 750产雹，滿屏是750诫惭；
- deviceHeight (number): 設(shè)備高度。
