優點:比 url 傳遞、或是 storage 、或是 globalData 更方便javascript
1:如 url 不能直接傳一個 Object 要傳的又要序列化與反序列化操做,麻煩(普通的單個變量仍是挺便捷簡單實在的)java
2:如 storage 也麻煩,又要set 到用的時候還要 get編程
3: globalData 來雖然比上面兩種貌似更有優點,可是這個交互的數據挺大,成天掛載在globalData,同時掛載上後去到那個頁面能訪問的到(別人說能夠設置null,即便這樣還不是 多以key在globalData上)小程序
可是不少的preload數據只是單一渲染後就不要,也沒有必要掛載在 globalData 上,因此本人以爲 $preload 大有用處框架
$preload 使用函數
A頁面preload數據this
注意:先 preload 再進行頁面路由跳轉,編程序路由跳轉啊,url
不要使用給navigator組件綁定點擊事件preload啊spa
data = { preloadData: { name: 'Hello', age: '18' } }; methods = { navigateToBPage() { this.$preload('preload', preloadData) //先 wepy.navigateTo({ url: `/pages/b/b?sourcePage=${this.sourcePage}` }); } //後 }; // 'preload' 本身命名一個想要的有意義的變量名就好 // preloadData 數據格式,根據本身需求定義
B頁面接收blog
//必須在 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 這樣結合方式傳遞數據的!
看到這裏,不放你也使用,試一試......