小程序邏輯層之註冊頁面Component

Component 構造器構造頁面

Page 構造器適用於簡單的頁面，對於複雜的頁面可能並不好用。可以使用 Component 構造器來構造複雜的頁面。 Component 構造器的主要區別是：方法需要放在 methods: { } 裏面。
Component 構造器可用於定義組件，調用 Component 構造器時可以指定組件的屬性、數據、方法等。
詳細參數

Component({

  behaviors: [],

  properties: {
    myProperty: { // 屬性名
      type: String,
      value: ''
    },
    myProperty2: String // 簡化的定義方式
  },
  
  data: {}, // 私有數據，可用於模板渲染

  lifetimes: {
    // 生命週期函數，可以爲函數，或一個在methods段中定義的方法名
    attached: function () { },
    moved: function () { },
    detached: function () { },
  },

  // 生命週期函數，可以爲函數，或一個在methods段中定義的方法名
  attached: function () { }, // 此處attached的聲明會被lifetimes字段中的聲明覆蓋
  ready: function() { },

  pageLifetimes: {
    // 組件所在頁面的生命週期函數
    show: function () { },
    hide: function () { },
    resize: function () { },
  },

  methods: {
    onMyButtonTap: function(){
      this.setData({
        // 更新屬性和數據的方法與更新頁面數據的方法類似
      })
    },
    // 內部方法建議以下劃線開頭
    _myPrivateMethod: function(){
      // 這裏將 data.A[0].B 設爲 'myPrivateData'
      this.setData({
        'A[0].B': 'myPrivateData'
      })
    },
    _propertyChange: function(newVal, oldVal) {

    }
  }

})

使用 Component 構造器構造頁面
Component 構造器的主要區別是：方法需要放在 methods: { } 內

Component({
  data: {
    text: "This is page data."
  },
  methods: {
    onLoad: function(options) {
      // 頁面創建時執行
    },
    onPullDownRefresh: function() {
      // 下拉刷新時執行
    },
    // 事件響應函數
    viewTap: function() {
      // ...
    }
  }
})

更多詳情請參考：
https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/component.html