新聞中心
- behaviors
- 定義和使用 behaviors
- 字段的覆蓋和組合規(guī)則
- 內(nèi)置 behaviors
- swan://form-field
- swan://component-export
behaviors
定義和使用 behaviors
定義:behaviors 用于組件間代碼共享,類似于一些編程語言中的“mixins”或“traits”。

創(chuàng)新互聯(lián)制作網(wǎng)站網(wǎng)頁找三站合一網(wǎng)站制作公司,專注于網(wǎng)頁設(shè)計(jì),網(wǎng)站建設(shè)、網(wǎng)站制作,網(wǎng)站設(shè)計(jì),企業(yè)網(wǎng)站搭建,網(wǎng)站開發(fā),建網(wǎng)站業(yè)務(wù),680元做網(wǎng)站,已為上千服務(wù),創(chuàng)新互聯(lián)網(wǎng)站建設(shè)將一如既往的為我們的客戶提供最優(yōu)質(zhì)的網(wǎng)站建設(shè)、網(wǎng)絡(luò)營銷推廣服務(wù)!
- 每個(gè) behavior 可以包含一組屬性、數(shù)據(jù)、生命周期函數(shù)和方法,組件引用它時(shí),它的屬性、數(shù)據(jù)和方法會被合并到組件中,生命周期函數(shù)也會在對應(yīng)時(shí)機(jī)被調(diào)用。
- 每個(gè)組件可以引用多個(gè) behavior 。 同時(shí)該 behavior 也可以引用其它 behavior 。
- behavior 需要使用 Behavior() 構(gòu)造器定義。
代碼示例
在開發(fā)者工具中打開
在開發(fā)者工具中打開
在 WEB IDE 中打開
// my-behavior.jsmodule.exports = Behavior({behaviors: [],properties: {myBehaviorProperty: {type: String,value: 'behavior'}},data: {myBehaviorData: {}},attached: function(){},methods: {myBehaviorMethod: function(){}}});
組件引用時(shí),需在 behaviors 定義段中將它們逐個(gè)列出。
代碼示例
// my-component.jsvar myBehavior = require('my-behavior')Component({behaviors: [myBehavior],properties: {myProperty: {type: String,value: 'component'}},data: {myData: {}},attached: function(){},methods: {myMethod: function(){}}});
通過上面的例子可知:
- my-behavior 中包含有 myBehaviorProperty 屬性、 myBehaviorData 數(shù)據(jù)字段、 myBehaviorMethod 方法和一個(gè) attached 生命周期函數(shù)。
- 在 my-component 組件定義中引入了 my-behavior.js 。
這將使得 my-component 中最終包含 myBehaviorProperty 、 myProperty 兩個(gè)屬性, myBehaviorData 、 myData 兩個(gè)數(shù)據(jù)字段,和 myBehaviorMethod 、 myMethod 兩個(gè)方法。
當(dāng)組件觸發(fā) attached 生命周期時(shí),會依次觸發(fā) my-behavior.js 中的 attached 生命周期函數(shù)和 my-component.js 中的 attached 生命周期函數(shù)。
字段的覆蓋和組合規(guī)則
組件和它引用的 behavior 中可以包含同名的字段,對這些字段的處理方法如下:
- 如果有同名的屬性或方法,組件本身的屬性或方法會覆蓋 behavior 中的屬性或方法;
- 如果引用了多個(gè) behavior,在定義段中靠后 behavior 中的屬性或方法會覆蓋靠前的屬性或方法;
- 如果有同名的數(shù)據(jù)字段,如果數(shù)據(jù)是對象類型,會進(jìn)行對象合并,如果是非對象類型則會進(jìn)行相互覆蓋;
- 生命周期函數(shù)不會相互覆蓋,而是在對應(yīng)觸發(fā)時(shí)機(jī)被逐個(gè)調(diào)用。如果同一個(gè) behavior 被一個(gè)組件多次引用,它定義的生命周期函數(shù)只會被執(zhí)行一次。
內(nèi)置 behaviors
自定義組件可以通過引用內(nèi)置的 behavior 來獲得內(nèi)置組件的一些行為。
代碼示例
在開發(fā)者工具中打開
在開發(fā)者工具中打開
在 WEB IDE 中打開
Component({behaviors: ['swan://form-field']});
- 在上例中, swan://form-field 代表一個(gè)內(nèi)置 behavior,它使得這個(gè)自定義組件有類似于表單控件的行為。
- 內(nèi)置 behavior 往往會為組件添加一些屬性。在沒有特殊說明時(shí),組件可以覆蓋這些屬性來改變它的 type 或添加 observer 。
swan://form-field
解釋:使自定義組件有類似于表單控件的行為。
form 組件可以識別這些自定義組件,并在 submit 事件中返回組件的字段名及其對應(yīng)字段值。這將為它添加以下兩個(gè)屬性:
| 屬性名 | 類型 | 描述 | 最低版本 |
|---|---|---|---|
| name | String | 在表單中的字段名 | 1.13.29 |
| value | 任意 | 在表單中的字段值 | 1.13.29 |
swan://component-export
從基礎(chǔ)庫版本 2.0.5 開始提供支持。
解釋:使自定義組件支持 export 定義段。這個(gè)定義段可以用于指定組件被 selectComponent 調(diào)用時(shí)的返回值。
未使用這個(gè)定義段時(shí), selectComponent 將默認(rèn)返回自定義組件的 this 。使用這個(gè)定義段時(shí),將以這個(gè)定義段的函數(shù)返回值代替。
代碼示例
在開發(fā)者工具中打開
在開發(fā)者工具中打開
在 WEB IDE 中打開
// 自定義組件的js文件Component({behaviors: ['swan://component-export'],export() {return { componentField: 'componentValue' }}});
// 等于 { componentField: 'componentValue' }this.selectComponent('#custom-id')
網(wǎng)頁標(biāo)題:創(chuàng)新互聯(lián)百度小程序教程:behaviors
轉(zhuǎn)載來于:http://fisionsoft.com.cn/article/dhgjscd.html


咨詢
建站咨詢
