1  組件傳遞內(nèi)容給頁(yè)面

    給組件設(shè)置myevent事件，通過(guò)this.triggerEvent('myevent', myEventDetail) 觸發(fā)該myevent事件并傳遞內(nèi)容，在頁(yè)面用onMyEventshi事件監(jiān)聽(tīng)傳遞過(guò)來(lái)的數(shù)據(jù)。 

Page({

  // 監(jiān)聽(tīng)myevent事件

  onMyEvent: function (e) {

    console.log('接收a組件傳遞的內(nèi)容:', e.detail) // '我是a組件'

 }})                        

 

組件

點(diǎn)擊Component({

  properties: {}  methods: {

    onTap: function(){

      var myEventDetail = '我是a組件'

      this.triggerEvent('myevent', myEventDetail) // 觸發(fā)組件上的“myevent”事件

    }  }

})

 

2  組件與組件通信

兩個(gè)無(wú)任何關(guān)聯(lián)的組件：通過(guò)全局變量或本地緩存?zhèn)鬟f數(shù)據(jù)

兩個(gè)有關(guān)聯(lián)的組件(同一個(gè)父頁(yè)面下)： 通過(guò)上面的方法，用組件 => 頁(yè)面 => 組件的方式傳遞數(shù)據(jù)。

2.頁(yè)面之間的通信

2-1.使用全局變量 app.globalData

2-2.使用本地緩存 wx.setStorageSync

2-3.url傳遞

 

// A頁(yè)面-傳遞數(shù)據(jù)

// 需要注意的是，wx.switchTab 中的 url 不能傳參數(shù)。

   wx.navigateTo({

                url:'../pageD/pageD?name=raymond&gender=male'

})

// B頁(yè)面-接收數(shù)據(jù)//

 通過(guò)onLoad的option...Page({

onLoad: function(option){ 

 console.log(option.name +'is'+ option.gender)// raymond is male

this.setData({option: option }) 

 }})

 

2-2 后一級(jí)頁(yè)面對(duì)前一級(jí)頁(yè)面的數(shù)據(jù)的管理(通過(guò)獲取到頁(yè)面對(duì)象進(jìn)行數(shù)據(jù)操作)

這個(gè)方法的精髓，是通過(guò)獲取到其他頁(yè)面的對(duì)象原型， 然后通過(guò)原型方法 setData 對(duì)當(dāng)前對(duì)象管理的 data 進(jìn)行修改 

示例如下：

//pageE.js

Page({

data: {

    index:1

}})

 

當(dāng)跳轉(zhuǎn)到下一個(gè)頁(yè)面 F 之后，假定在 F 中有操作需要對(duì) E 中的數(shù)據(jù)有修改，則可以使用以下方法：

這個(gè)方法可以操作頁(yè)面堆棧里面的頁(yè)面的數(shù)據(jù)， 可以做到讓后一級(jí)頁(yè)面對(duì)上級(jí)頁(yè)面群的數(shù)據(jù)管理 。

// pageF.js

Page({ 

 changeIndexInE:function(){

varpages = getCurrentPages();

varprevPage = pages[pages.length -2];

 prevPage.setData({ 

 index:0

})

 }})

 

 

3，頁(yè)面與模板之間的通信

傳入模板的除了變量，還可以是事件方法對(duì)象。例如，模板中的點(diǎn)擊事件，可以傳遞到使用模板的元素中。

頁(yè)面

Page({

  data: {

    item: {

      index: 0,

      msg: 'this is a template',

      time: '2016-09-15'

    }  }

})