解决 uni-app 中富文本包含双引号无法渲染的问题


测试用富文本如下:

这是一段富文本

使用 uni-app 的 rich-text 组件直接渲染会抛出 Vue 引擎解析的错误,原因是 font-family 的值里面包含了双引号,此时需要先处理下引号嵌套的问题再使用。

function formatQuoteInStyle(htmlString) {
    var stylePattern = /style="[^=>]*"[\s+\w+=|>]/g;
    var innerQuotePattern = /(?)/g;
    return htmlString.replace(stylePattern, function(matches) {
        return matches.replace(innerQuotePattern, '\'');
    });
}

上述方法会将 style 属性值里面的双引号转换为单引号,这样就可以继续执行下去了。