導(dǎo)語(yǔ)

頁(yè)面之間通訊也是項(xiàng)目的必要需求，今天說(shuō)一說(shuō)頁(yè)面通訊的方式。我能想到的就四種。1、在地址后面拼接參數(shù) 2、使用storage存在本地來(lái)實(shí)現(xiàn) 3、BroadcastChannel(不過(guò)這個(gè)是實(shí)例之間，所以很多時(shí)候沒(méi)法使用) 4、vue傳至原生再傳回vue（就不介紹這個(gè)了）

1. 地址拼接的方式

其中z=1 就是我們需要傳遞下去的參數(shù)，比較適合簡(jiǎn)單參數(shù)的傳遞。

navigator.push({
              url: 'http://192.168.2.164:8081/dist/next.js?z=1',
              animated: 'true'
                })

拿到地址進(jìn)行解析，就可以直接拿到傳遞的參數(shù)了

weex.config.bundleUrl

getUrlParam() {
      var name, value;
      var str = weex.config.bundleUrl; //取得整個(gè)地址欄
      var num = str.indexOf("?");
      str = str.substr(num + 1); //取得所有參數(shù)   

      var arr = str.split("&"); //各個(gè)參數(shù)放到數(shù)組里
      for (var i = 0; i < arr.length; i++) {
        num = arr[i].indexOf("=");
        if (num > 0) {
          name = arr[i].substring(0, num);
          value = arr[i].substr(num + 1);
          this.paramsDic[name] = value;
        }
      }
    }

2. storage模塊存儲(chǔ)在本地

具體操作無(wú)非就是以鍵值的形式存在本地，不過(guò)呢 ，因?yàn)槭莻髦邓胁恍枰斜４姹镜?，所有統(tǒng)一使用一個(gè)鍵，每次都能替代掉之前存在本地的值。當(dāng)然這是我個(gè)人能想到的方式，如有不對(duì)歡迎大神指出。
storage請(qǐng)看這篇

3. BroadcastChannel

官網(wǎng)文檔

具體例子
a頁(yè)面中的發(fā)送和接收

      const aPost = new BroadcastChannel("zzz");
      aPost.postMessage('a_a_a');
 aPost.onmessage = function(event) {
        console.log("aaa" + event.data); //b頁(yè)面發(fā)送的消息
      };

b頁(yè)面中的發(fā)送和接收

  var bPost = new BroadcastChannel("zzz");
    bPost.onmessage = function(event) {
      console.log("aaa" + event.data); //a頁(yè)面發(fā)送的消息
    };
       bPost .postMessage("s_s_s");

其實(shí)很好理解通訊過(guò)程，就跟我們的iOS中的通知是一個(gè)意思，一處發(fā)送通知，可以多處接收通知。
我們看下面這種官方文檔上的圖

E12361E9-D2B9-457A-8644-D1E2D0F243F0.png