wepy框架的API的預加載$preload這功能闊以喔

優勢：比 url 傳遞、或是 storage 、或是 globalData 更方便

1：如 url 不能直接傳一個 Object 要傳的又要序列化與反序列化操作，麻煩（普通的單個變量還是挺便捷簡單實在的）

2：如 storage 也麻煩，又要set 到用的時候還要 get

3:  globalData 來雖然比上面兩種貌似更有優勢，但是這個交互的數據挺大，整天掛載在globalData，同時掛載上后去到那個頁面能訪問的到（別人說可以設置null，即使這樣還不是      多以key在globalData上）

     但是很多的preload數據只是單一渲染后就不要，也沒有必要掛載在 globalData 上，所以本人覺得 $preload 大有用處

$preload 使用

A頁面preload數據

注意：先 preload 再進行頁面路由跳轉，編程序路由跳轉啊，

不要使用給navigator組件綁定點擊事件preload啊

 

 data = {
      preloadData: {
        name: 'Hello',
        age: '18'
      }
    };
    methods = {
      navigateToBPage() {
        this.$preload('preload', preloadData) //先
        wepy.navigateTo({
          url: `/pages/b/b?sourcePage=${this.sourcePage}`
        });
      } //后
    };
    // 'preload' 自己命名一個想要的有意義的變量名就好
    //  preloadData 數據格式，根據自己需求定義

 

　　

 

B頁面接收

  //必須在 onLoad 鈎子函數才可以接收到 
    // options 為 url 的參數
    // preloadData 為上個頁面 preload 過來的
    // 具體打印 出來 查看 preloadData  具體是什么
    onLoad(options, preloadData) {
      if (preloadData.preload && preloadData.preload.name) {　　
        cosole.log('拿到A頁面preload過來的數據了：', preloadData.preload);
      }
    };

　　

假如是A頁面的組件觸發的，那preload就要變通一下，方法有可以多種的

 

//1: 直接定義組件的methods的方法里面
    methods = {
      navigateToBPage() {
        this.$parent.$preload('preload', preloadData) //先
        wepy.navigateTo({
          url: `/pages/b/b?sourcePage=${this.sourcePage}`
        });
      } //后
    };
    //***********************************************************
    //2:使用組件的通訊交互
    methods = {
      navigateToBPage() {
        this.$emit('emit_parent_preload', preloadData);
      }
    };
    //$emit一個事件出去，觸發父頁面preload
    //A頁面在events定義：
    events = {
      emit_parent_preload(preloadData) {
        this.$preload('preload', preloadData);
         wepy.navigateTo({
          url: `/pages/b/b?sourcePage=${this.sourcePage}`
        });
      }
    }

 

　　

 

　　

我個人在使用 wepy框架開發小程序，是挺喜歡用 prelaod 與路由導航的 API 這樣結合方式傳遞數據的！

看到這里，不放你也使用，試一試......