QQ小程序 使用 Component 構(gòu)造器構(gòu)造頁面

事實上，小程序的頁面也可以視為自定義組件。因而，頁面也可以使用 Component 構(gòu)造器構(gòu)造，擁有與普通組件一樣的定義段與實例方法。但此時要求對應(yīng) json 文件中包含 usingComponents 定義段。 此時，組件的屬性可以用于接收頁面的參數(shù)，如訪問頁面 /pages/index/index?paramA=123&paramB=xyz ，如果聲明有屬性 paramA 或 paramB ，則它們會被賦值為 123 或 xyz 。 頁面的生命周期方法（即 on 開頭的方法），應(yīng)寫在 methods 定義段中。

代碼示例：

{
  "usingComponents": {}
}

Component({


  properties: {
    paramA: Number,
    paramB: String,
  },


  methods: {
    onLoad() {
      this.data.paramA // 頁面參數(shù) paramA 的值
      this.data.paramB // 頁面參數(shù) paramB 的值
    }
  }


})

Bug & Tips:

• 使用 this.data 可以獲取內(nèi)部數(shù)據(jù)和屬性值，但不要直接修改它們，應(yīng)使用 setData 修改。
• 生命周期函數(shù)無法在組件方法中通過 this 訪問到。
• 屬性名應(yīng)避免以 data 開頭，即不要命名成 dataXyz 這樣的形式，因為在 QML 中， data-xyz="" 會被作為節(jié)點 dataset 來處理，而不是組件屬性。
• 在一個組件的定義和使用時，組件的屬性名和 data 字段相互間都不能沖突（盡管它們位于不同的定義段中）。
• 對象類型的屬性和 data 字段中可以包含函數(shù)類型的子字段，即可以通過對象類型的屬性字段來傳遞函數(shù)。低于這一版本的基礎(chǔ)庫不支持這一特性。
• bug : 對于 type 為 Object 或 Array 的屬性，如果通過該組件自身的 this.setData 來改變屬性值的一個子字段，則依舊會觸發(fā)屬性 observer ，且 observer 接收到的 newVal 是變化的那個子字段的值， oldVal 為空， changedPath 包含子字段的字段名相關(guān)信息。
• bug : 位于 slot 中的自定義組件沒有觸發(fā) pageLifetimes 中聲明的頁面生命周期