日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

Component(Object object)

創(chuàng)建自定義組件，接受一個(gè) Object 類型的參數(shù)。

創(chuàng)新互聯(lián)是一家專業(yè)提供巫山企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站建設(shè)、網(wǎng)站制作、H5開發(fā)、小程序制作等業(yè)務(wù)。10年已為巫山眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)的建站公司優(yōu)惠進(jìn)行中。

參數(shù)

Object object

定義段	類型	是否必填	描述	最低版本
properties	Object Map	否	組件的對(duì)外屬性，是屬性名到屬性設(shè)置的映射表
data	Object	否	組件的內(nèi)部數(shù)據(jù)，和 properties 一同用于組件的模板渲染
observers	Object	否	組件數(shù)據(jù)字段監(jiān)聽器，用于監(jiān)聽 properties 和 data 的變化，參見 數(shù)據(jù)監(jiān)聽器	2.6.1
methods	Object	否	組件的方法，包括事件響應(yīng)函數(shù)和任意的自定義方法，關(guān)于事件響應(yīng)函數(shù)的使用，參見 組件間通信與事件
behaviors	String Array	否	類似于mixins和traits的組件間代碼復(fù)用機(jī)制，參見 behaviors
created	Function	否	組件生命周期函數(shù)-在組件實(shí)例剛剛被創(chuàng)建時(shí)執(zhí)行，注意此時(shí)不能調(diào)用 setData )
attached	Function	否	組件生命周期函數(shù)-在組件實(shí)例進(jìn)入頁面節(jié)點(diǎn)樹時(shí)執(zhí)行)
ready	Function	否	組件生命周期函數(shù)-在組件布局完成后執(zhí)行)
moved	Function	否	組件生命周期函數(shù)-在組件實(shí)例被移動(dòng)到節(jié)點(diǎn)樹另一個(gè)位置時(shí)執(zhí)行)
detached	Function	否	組件生命周期函數(shù)-在組件實(shí)例被從頁面節(jié)點(diǎn)樹移除時(shí)執(zhí)行)
relations	Object	否	組件間關(guān)系定義，參見 組件間關(guān)系
externalClasses	String Array	否	組件接受的外部樣式類，參見 外部樣式類
options	Object Map	否	一些選項(xiàng)（文檔中介紹相關(guān)特性時(shí)會(huì)涉及具體的選項(xiàng)設(shè)置，這里暫不列舉）
lifetimes	Object	否	組件生命周期聲明對(duì)象，參見 組件生命周期	2.2.3
pageLifetimes	Object	否	組件所在頁面的生命周期聲明對(duì)象，參見 組件生命周期	2.2.3
definitionFilter	Function	否	定義段過濾器，用于自定義組件擴(kuò)展，參見 自定義組件擴(kuò)展	2.2.3

生成的組件實(shí)例可以在組件的方法、生命周期函數(shù)和屬性 observer 中通過 this 訪問。組件包含一些通用屬性和方法。

屬性名	類型	描述
is	String	組件的文件路徑
id	String	節(jié)點(diǎn)id
dataset	String	節(jié)點(diǎn)dataset
data	Object	組件數(shù)據(jù)，包括內(nèi)部數(shù)據(jù)和屬性值
properties	Object	組件數(shù)據(jù)，包括內(nèi)部數(shù)據(jù)和屬性值（與 data 一致）

方法名	參數(shù)	描述	最低版本
setData	Object newData	設(shè)置data并執(zhí)行視圖層渲染
hasBehavior	Object behavior	檢查組件是否具有 behavior （檢查時(shí)會(huì)遞歸檢查被直接或間接引入的所有behavior）
triggerEvent	String name, Object detail, Object options	觸發(fā)事件，參見 組件間通信與事件
createSelectorQuery		創(chuàng)建一個(gè) SelectorQuery 對(duì)象，選擇器選取范圍為這個(gè)組件實(shí)例內(nèi)
createIntersectionObserver		創(chuàng)建一個(gè) IntersectionObserver 對(duì)象，選擇器選取范圍為這個(gè)組件實(shí)例內(nèi)
createMediaQueryObserver		創(chuàng)建一個(gè) MediaQueryObserver 對(duì)象	2.11.1
selectComponent	String selector	使用選擇器選擇組件實(shí)例節(jié)點(diǎn)，返回匹配到的第一個(gè)組件實(shí)例對(duì)象（會(huì)被 wx://component-export 影響）
selectAllComponents	String selector	使用選擇器選擇組件實(shí)例節(jié)點(diǎn)，返回匹配到的全部組件實(shí)例對(duì)象組成的數(shù)組（會(huì)被 wx://component-export 影響）
selectOwnerComponent		選取當(dāng)前組件節(jié)點(diǎn)所在的組件實(shí)例（即組件的引用者），返回它的組件實(shí)例對(duì)象（會(huì)被 wx://component-export 影響）	2.8.2
getRelationNodes	String relationKey	獲取這個(gè)關(guān)系所對(duì)應(yīng)的所有關(guān)聯(lián)節(jié)點(diǎn)，參見 組件間關(guān)系
groupSetData	Function callback	立刻執(zhí)行 callback ，其中的多個(gè) setData 之間不會(huì)觸發(fā)界面繪制（只有某些特殊場景中需要，如用于在不同組件同時(shí) setData 時(shí)進(jìn)行界面繪制同步）	2.4.0
getTabBar		返回當(dāng)前頁面的 custom-tab-bar 的組件實(shí)例，詳見自定義 tabBar	2.6.2
getPageId		返回頁面標(biāo)識(shí)符（一個(gè)字符串），可以用來判斷幾個(gè)自定義組件實(shí)例是不是在同一個(gè)頁面內(nèi)	2.7.1
animate	String selector, Array keyframes, Number duration, Function callback	執(zhí)行關(guān)鍵幀動(dòng)畫，詳見動(dòng)畫	2.9.0
clearAnimation	String selector, Object options, Function callback	清除關(guān)鍵幀動(dòng)畫，詳見動(dòng)畫	2.9.0

代碼示例：

在開發(fā)者工具中預(yù)覽效果

Component({

  behaviors: [],

  // 屬性定義（詳情參見下文）
  properties: {
    myProperty: { // 屬性名
      type: String,
      value: ''
    },
    myProperty2: String // 簡化的定義方式
  },

  data: {}, // 私有數(shù)據(jù)，可用于模板渲染

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

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

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

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

    }
  }

})

注意：在 properties 定義段中，屬性名采用駝峰寫法（propertyName）；在 wxml 中，指定屬性值時(shí)則對(duì)應(yīng)使用連字符寫法（component-tag-name property-name="attr value"），應(yīng)用于數(shù)據(jù)綁定時(shí)采用駝峰寫法（attr=""）。

properties 定義

定義段	類型	是否必填	描述	最低版本
type		是	屬性的類型
optionalTypes	Array	否	屬性的類型（可以指定多個(gè)）	2.6.5
value		否	屬性的初始值
observer	Function	否	屬性值變化時(shí)的回調(diào)函數(shù)

屬性值的改變情況可以使用 observer 來監(jiān)聽。目前，在新版本基礎(chǔ)庫中不推薦使用這個(gè)字段，而是使用 Component 構(gòu)造器的 observers 字段代替，它更加強(qiáng)大且性能更好。

代碼示例：

Component({
  properties: {
    min: {
      type: Number,
      value: 0
    },
    min: {
      type: Number,
      value: 0,
      observer: function(newVal, oldVal) {
        // 屬性值變化時(shí)執(zhí)行
      }
    },
    lastLeaf: {
      // 這個(gè)屬性可以是 Number 、 String 、 Boolean 三種類型中的一種
      type: Number,
      optionalTypes: [String, Object],
      value: 0
    }
  }
})

屬性的類型可以為 String Number Boolean Object Array 其一，也可以為 null 表示不限制類型。

多數(shù)情況下，屬性最好指定一個(gè)確切的類型。這樣，在 WXML 中以字面量指定屬性值時(shí)，值可以獲得一個(gè)確切的類型，如：

此時(shí)，由于自定義組件的對(duì)應(yīng)屬性被規(guī)定為 Number 類型， min 和 max 會(huì)被賦值為 1 和 5 ，而非 "1" 和 "5" ，即：

this.data.min === 1 // true
this.data.max === 5 // true

提示：

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

---

Behavior(Object object)

注冊一個(gè) behavior，接受一個(gè) Object 類型的參數(shù)。

參數(shù)

Object object

定義段	類型	是否必填	描述	最低版本
properties	Object Map	否	同組件的屬性
data	Object	否	同組件的數(shù)據(jù)
methods	Object	否	同自定義組件的方法
behaviors	String Array	否	引入其它的 behavior
created	Function	否	生命周期函數(shù)
attached	Function	否	生命周期函數(shù)
ready	Function	否	生命周期函數(shù)
moved	Function	否	生命周期函數(shù)
detached	Function	否	生命周期函數(shù)

代碼示例：

// my-behavior.js
module.exports = Behavior({
  behaviors: [],
  properties: {
    myBehaviorProperty: {
      type: String
    }
  },
  data: {
    myBehaviorData: {}
  },
  attached: function(){},
  methods: {
    myBehaviorMethod: function(){}
  }
})

網(wǎng)頁標(biāo)題：創(chuàng)新互聯(lián)小程序教程：微信小程序自定義組件
本文網(wǎng)址：http://www.5511xx.com/article/ccecodc.html