如果你作為文章資源類或者博客類的小程序你就會發現，很多時候你的文章數據都是html格式或md格式，這樣如果不經過處理，會非常難看，所以富文本解析就顯得格外重要了，今天給大家寫一個uniapp怎么使用富文本解析插件的教程。

最近一直在重構typecho博客小程序，但是現在的進度很緩慢，總覺著頁面效果達不到自己想要的效果。抽空挖一個重點來給大家寫個教程，說到博客小程序，最重要的就是文章了，但是從數據庫中獲取的文章格式是md的，如果直接顯示會顯得很亂，而且會引起極度不適，所以大家應該會想到富文本解析，有過經驗的人應該用過微信富文本解析插件wxParse，但是他只能在微信端使用，而我們用uniapp的當然是希望全端兼容呀。那么往下看吧。

在uniapp插件市場有一些富文本插件，但是教程不是特別詳細，這里給大家寫一個詳細的教程幫助大家消化一下。

安裝插件

進入uniapp插件市場找到想要的插件，然后單擊右上角的使用HBuilderX導入插件，然后選擇你需要富文本解析功能的項目。

安裝marked模塊

由于typecho程序默認使用的是md語法，這里我們需要先使用marked模塊將md轉化為html格式，才能進行富文本的渲染。如果你說wordpress，就不用進行這一步了。具體安裝步驟如下：右鍵單擊項目根目錄文件夾選擇：使用命令行窗口打開目錄

然后下如下圖所示地方輸入npm install marked，等待完成

使用插件

先將獲得的文章內容content進行md轉html處理，然后再將轉化后的內容進行富文本渲染，具體步驟如下：在需要使用的頁面的sript導入插件和marked模塊，代碼如下：import marked from 'marked';

import jyfParser from "@/components/jyf-parser/jyf-parser"; //插件安裝你安裝的插件來定

md轉html處理var article = marked(content);

這樣得到的article就是經過轉化獲得的html數據富文本解析并展示

這樣就可以展示typecho中的文章數據了。

說明

該教程主要是插件的使用，所以對數據的賦值等寫的不是特別完善，可根據實際情況進行修改。

贊 5

原創文章，作者：小創果，如若轉載，請注明出處：https://www.i4qq.com/jpjc/uniappfwbjc.html

總結

以上是生活随笔為你收集整理的uniapp怎么解析html字符串,uniapp富文本解析插件的详细使用教程的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。