抽象節(jié)點(diǎn)

這個(gè)特性自小程序基礎(chǔ)庫(kù)版本 1.9.6 開始支持。

在組件中使用抽象節(jié)點(diǎn)

有時(shí)，自定義組件模板中的一些節(jié)點(diǎn)，其對(duì)應(yīng)的自定義組件不是由自定義組件本身確定的，而是自定義組件的調(diào)用者確定的。這時(shí)可以把這個(gè)節(jié)點(diǎn)聲明為“抽象節(jié)點(diǎn)”。例如，我們現(xiàn)在來實(shí)現(xiàn)一個(gè)“選框組”(selectable-group)組件，它其中可以放置單選框(custom-radio)或者復(fù)選框(custom-checkbox)。這個(gè)組件的 wxml 可以這樣編寫：代碼示例：<view wx:for="{{labels}}"> <label> <selectable disabled="{{false}}">selectable> {{item}} label>view>其中，“selectable”不是任何在 json 文件的 usingComponents 字段中聲明的組件，而是一個(gè)抽象節(jié)點(diǎn)。它需要在 componentGenerics 字段中聲明：{"componentGenerics": {"selectable": true
}
}

使用包含抽象節(jié)點(diǎn)的組件

在使用 selectable-group 組件時(shí)，必須指定“selectable”具體是哪個(gè)組件：<selectable-group generic:selectable="custom-radio" />這樣，在生成這個(gè) selectable-group 組件的實(shí)例時(shí)，“selectable”節(jié)點(diǎn)會(huì)生成“custom-radio”組件實(shí)例。類似地，如果這樣使用：<selectable-group generic:selectable="custom-checkbox" />“selectable”節(jié)點(diǎn)則會(huì)生成“custom-checkbox”組件實(shí)例。注意：上述的 custom-radio 和 custom-checkbox 需要包含在這個(gè) wxml 對(duì)應(yīng) json 文件的 usingComponents 定義段中。{"usingComponents": {"custom-radio": "path/to/custom/radio","custom-checkbox": "path/to/custom/checkbox"
}
}

抽象節(jié)點(diǎn)的默認(rèn)組件

抽象節(jié)點(diǎn)可以指定一個(gè)默認(rèn)組件，當(dāng)具體組件未被指定時(shí)，將創(chuàng)建默認(rèn)組件的實(shí)例。默認(rèn)組件可以在 componentGenerics 字段中指定：{ "componentGenerics": { "selectable": { "default": "path/to/default/component" } }}提示：

• 節(jié)點(diǎn)的 generic 引用 generic:xxx="yyy"?中，值 yyy 只能是靜態(tài)值，不能包含數(shù)據(jù)綁定。因而抽象節(jié)點(diǎn)特性并不適用于動(dòng)態(tài)決定節(jié)點(diǎn)名的場(chǎng)景。

總結(jié)

以上是生活随笔為你收集整理的小程序 wxml selectable_微信小程序 抽象节点的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。