第一種,直接小程序內寫死協議,每次需發布小程序版本更新
第二種,通過web-view打開協議(協議地址需在小程序業務域名內(需在小程序開發平台管理台配置))
具體方法:
1、編輯一個.html格式的文件,內容如下:
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
把富文本的內容放到這里來
</body>
</html>
2、通過富文本編輯器編輯好內容,復制出html,並放入1中“.html”文件body之間,如:
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p style="text-align:center;">
Think Different
</p>
<p>
Here’s to the crazy ones. The misfits.
</p>
<p style="text-align:right;">
- Apple Inc.
</p>
</body>
</html>
復制出來的內容一定是得帶html標簽的(如上面<body></body>之間的代碼),不然就沒有樣式效果了
3、第三步,需要用到的地方上傳該文件
4、小程序通過web-view組件引入該文件
第三種,通過小程序富文本組件 <rich-text>加載
具體方法:
1、在富文本編輯器里編輯好內容,復制出html,並放入“名稱.html”文件內
注意:在富文本編輯器內編輯好后,點第一個按鈕,拷貝出轉義帶html標簽的模板代碼,一定得是帶標簽的,一定得是帶標簽的,一定得是帶標簽的,如下:

2、在需要的地方上傳該文件
3、小程序中通過wx.request獲取文件,如:
wx.request({
url: 'XXXXXX/activityTopic.html',
dataType:'html',
method:'GET',
success (res) {
that.setData({
htmlSnip:res.data
})
}
})
模板引入
<rich-text nodes="{{htmlSnip}}"></rich-text>
至於展示效果,第一種和第三種基本是相同的(可用於彈窗內等多種展示方式),對於第二種,web-view就只能全屏頁面展示了
注:“.html”需先定義好文件名,方便小程序內引用該文件。
對於第三種方法的第2點也可以自己實現一個功能,直接傳html給到服務器保存起來,然后通過接口返回html模板。
富文本編輯器可隨意使用自己喜歡的編輯器
有問題,歡迎大家留言交流~,轉載請備明出處。
