鴻蒙OS 自定義組件 基本概念

2020-09-17 16:33 更新

自定義組件是用戶根據(jù)業(yè)務(wù)需求,將已有的組件組合,封裝成的新組件,可以在工程中多次調(diào)用,提高代碼的可讀性。自定義組件通過element引入到宿主頁(yè)面,使用方法:

<element name='comp' src='../../common/component/comp.hml'></element>
<div>
  <comp prop1='xxxx' @child1="bindParentVmMethod"></comp>
</div>

  • name屬性指自定義組件名稱(非必填),組件名稱對(duì)大小寫不敏感,默認(rèn)使用小寫。src屬性指自定義組件hml文件路徑(必填),若沒有設(shè)置name屬性,則默認(rèn)使用hml文件名作為組件名。

  • 事件綁定:自定義組件中綁定子組件事件使用(on|@)child1語(yǔ)法,子組件中通過this.$emit('child1', { params: '傳遞參數(shù)' })觸發(fā)事件并進(jìn)行傳值,父組件執(zhí)行bindParentVmMethod方法并接收子組件傳遞的參數(shù)。

說明

子組件中使用駝峰命名法命名的事件,在父組件中綁定時(shí)需要使用短橫線分隔命名形式,例如:@children-event表示綁定子組件的childrenEvent事件,如 @children-event="bindParentVmMethod"。

對(duì)象

屬性 類型 描述
data Object/Function 頁(yè)面的數(shù)據(jù)模型,類型是對(duì)象或者函數(shù),如果類型是函數(shù),返回值必須是對(duì)象。屬性名不能以$或_開頭,不要使用for, if, show, tid等保留字。data與private和public不能重合使用。
props Array/Object props用于組件之間的通信,可以通過<tag xxxx='value'>方式傳遞給組件;props名稱必須用小寫,不能以$或_開頭,不要使用for, if, show, tid等保留字。目前props的數(shù)據(jù)類型不支持Function。
computed Object 用于在讀取或設(shè)置進(jìn)行預(yù)先處理,計(jì)算屬性的結(jié)果會(huì)被緩存。計(jì)算屬性名不能以$或_開頭,不要使用保留字。
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)