基本格式:

  //壓棧跳轉到: xxx頁面
    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設置路由 (同時包括傳值) 和是否執行動畫

• navigator.push (params, callback)
• 注意: animated只支持字符串 " true" or "false", 官網說之后會修復

//出棧: 跳轉回: xxx頁面
var navigator = require('@weex-module/navigator')
var params = {
  animated: 'true'
}
navigator.pop(params, function () {
  // callback
})

由于需要url, 我們的url有很大部分是重復的, 官方給了一個截取的方法

//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是直接跳轉到新頁面上的.
       // in Browser or WebView
        if (typeof window === 'object') {
            nativeBase = isnav ? 'http://' + host + '/index.html?page=./dist/' : '/dist/';
        } else {
            nativeBase = 'http://' + host + '/dist/';
        }
    }

    return nativeBase;
};

我們使用的時候. 可以現獲取當前的url, 然后調用上面的方法, 截取出來基本的路徑

//可以在created時運行, 直接獲取到url
var self = this;
var base = apis.getBaseUrl(self.$getConfig().bundleUrl, true);
this.baseURL = base;

this. $getConfig().bundleUrl 可以獲取當前的Url

使用時:

            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會直接跳轉到這個文件生成的頁面上

$getConfig()的其他用法: 獲取當前全局環境變量和配置信息。

• config (object): 配置對象；
  • bundleUrl (string): bundle 的 url；
  • debug (boolean): 是否是調試模式；
  • env (object): 環境對象；
    • weexVersion (string): Weex sdk 版本；
    • appName (string): 應用名字；
    • appVersion (string): 應用版本；
    • platform (string): 平臺信息，是 iOS、Android 還是 Web；
    • osVersion (string): 系統版本；
    • deviceModel (string): 設備型號 （僅原生應用）；
    • deviceWidth (number): 設備寬度，默認為 750，滿屏是750；
    • deviceHeight (number): 設備高度。