微信小程序 rich-text的使用方法
更新時間：2017年08月04日 16:29:32 投稿：lqh
這篇文章主要介紹了 微信小程序 rich-text的使用方法的相關(guān)資料,這里提供屬性及方法并實現(xiàn)實例，幫助大家學(xué)習(xí)理解，需要的朋友可以參考下
微信小程序 rich-text的使用方法
rich-text
- 屬性：nodes 類型：Array / String 結(jié)點列表 / HTML String
- 全局支持class和style屬性，不支持id屬性。
- 結(jié)點類型：type = node ， name 標(biāo)簽名 String 是 支持部分受信任的HTML結(jié)點， attrs 屬性 Object 否 支持部分受信任的屬性，遵循Pascal命名法 ， children 子結(jié)點列表 Array 否 結(jié)構(gòu)和nodes一致
- 結(jié)點類型：type = text ，text 文本 String 是 支持entities
- nodes 不推薦使用 String 類型，性能會有所下降
- rich-text 組件內(nèi)屏蔽所有結(jié)點的事件。
- attrs 屬性不支持 id ，支持 class 。
- name 屬性大小寫不敏感。
- 如果使用了不受信任的HTML結(jié)點，該結(jié)點及其所有子結(jié)點將會被移除。
- img 標(biāo)簽僅支持網(wǎng)絡(luò)圖片。
<rich-text nodes="{{nodes}}" />
<rich-text nodes="{{nodes1}}" />
<rich-text nodes="{{nodes2}}" />
this.setData({
nodes: "<h1 style='color:red;'>html標(biāo)題</h1>",
nodes1: [{
name: "h1",
attrs: {
style: "color:red",
class: "red"
},
children: [{
type: "text",
text: '結(jié)點列表標(biāo)題'
}]
}],
nodes2: [{
name: "ul",
attrs: {
style: "padding:20px;border:1px solid blue;",
class: "red"
},
children: [
{
name: "li",
attrs: {
style: "color:red",
class: "red"
},
children: [{
type: "text",
text: '多層結(jié)點 無序列表'
}],
}, {
name: "li",
attrs: {
style: "color:red",
class: "red"
},
children: [{
type: "text",
text: '多層結(jié)點 無序列表1'
}],
}]
}]
})
以上就是微信小程序 rich-text的介紹，如有疑問請留言或者到本站社區(qū)交流討論，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關(guān)文章
webpack4 配置 ssr 環(huán)境遇到“document is not defined”
這篇文章主要介紹了webpack4 配置 ssr 環(huán)境遇到“document is not defined”，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-10-10
js操作GridView,實現(xiàn)自動計算的實現(xiàn)代碼，下面的代碼運行即可2009-03-03
這篇文章主要為大家詳細介紹了小程序自定義彈框效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的介紹與使用技巧
在日常的移動端開發(fā)時，一般都是試用chrome瀏覽器的移動端模式進行開發(fā)和調(diào)試，只有在chrome調(diào)試完成，而最近發(fā)現(xiàn)了一個新的調(diào)試方法，所以這篇文章主要給大家介紹了關(guān)于移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的基本資料，以及其使用的一些技巧，需要的朋友可以參考下。2017-10-10
這篇文章主要為大家詳細介紹了基于原生js淡入淡出函數(shù)封裝，可兼容IE，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-10-10
onclick與listeners的執(zhí)行先后問題詳細解剖
javascript中onclick與listeners的執(zhí)行先后問題一直都是大家所疑惑的地方，接下來將為大家解決此疑惑，感興趣的朋友可以了解下哦2013-01-01
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)簡單的計算器功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-03-03
table insertRow、deleteRow定義和用法總結(jié)
這篇文章主要對table insertRow、deleteRow定義和用法做下總結(jié),需要的朋友可以參考下2014-05-05
這篇文章主要介紹了JS delegate與live，有需要的朋友可以參考一下2013-12-12
因為Set中存放的數(shù)據(jù)都是不會重復(fù)的數(shù)據(jù),我們在編寫JS代碼的時候,因此我們可以利用Set來幫助我們更便捷地完成許多的事,下面這篇文章主要給大家介紹了關(guān)于JavaScript中Set基本使用方法的相關(guān)資料,需要的朋友可以參考下2022-11-11