如何使用wxParse解析html

2022-09-24 02:06:09 字數 677 閱讀 9287

最近專案上遇到在微信小程式裡需要顯示新聞內容,新聞內容是通過介面讀取的伺服器中的富文字內容,是html格式的,小程式預設是不支援html格式的內容顯示的,那我們需要顯示html內容的時候,就可以通過wxparse來實現。

準備工作:

**完之後我們需要用到目錄下的wxparse資料夾,把他拷貝到我們的專案目錄下

下面是具體的使用步驟

1、在app.wxss全域性樣式檔案中,需要引入wxparse的樣式表

2、在需要載入html內容的頁面對應的js檔案裡引入wxparse

這裡需要說明一下,我們先看網上說的,以下是截圖:

這種做法,是針對當前頁面只有資訊詳細資訊,沒有其他內容,比如:標題,日期,縮圖等等。如果需要運用自己的布局,可以這樣做,如圖:

3、引入js並載入資料

下面我們來簡單的說一下wxparse引數說明

* wxparse.wxparse(bindname , type, data, target,imagepadding)

* 1.bindname繫結的資料名(必填)

* 2.type可以為html或者md(必填)

* 3.data為傳入的具體資料(必填)

* 4.target為page物件,一般為this(必填)

* 5.imagepadding為當自適應是左右的單一padding(預設為0,可選)

使用wxParse外掛程式直接解析從後台獲取的html

我是wxparse官方文件,點我 基本使用方法 1.copy資料夾wxparse wxparse wxparse.js 必須存在 html2json.js 必須存在 htmlparser.js 必須存在 showdown.js 必須存在 wxdiscode.js 必須存在 wxparse.wxml ...

微信小程式 使用wxParse解析html

下面是具體的使用步驟 import page wxparse wxparse.wxss 2.在需要載入html內容的頁面對應的js檔案裡引入wxparse var wxparse require wxparse wxparse.js 3.通過呼叫wxparse.wxparse方法來設定html內容 ...

微信小程式使用wxParse解析html

下面是具體的使用步驟 import page wxparse wxparse.wxss 2.在需要載入html內容的頁面對應的js檔案裡引入wxparse var wxparse require wxparse wxparse.js 3.通過呼叫wxparse.wxparse方法來設定html內容 ...