先说一下“selectable” 长按选择区域复制,这个我在APP项目中 不起浸染,可能像文档说的,只支持“百度小程序”吧。在APP端起浸染的话,可以做如下修正,在样式中添加下面样式代码
.content-select-copy { -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;}
模板中调用的时候加上面样式
<view class="content-select-copy" > <rich-text :selectable='true' :nodes="content" @itemclick="handleRichText"></rich-text></view>
这样就可以在APP端实现长按选择区域复制了。

然后再说一下事宜处理itemclick,我们可以利用这个事宜实现对rich-text里面的节点内容进行处理,不过只能处理a和img标签,这个上面官方文档已经解释。
利用示例:
比如要对富文本内容中的所有链接跳到指定中转页再跳转,代码如下:
//假设我的rich-text类型为节点类型(rich-text支持节点数组或者字符串类型)handleRichText(e){ //这里对应我上面模板中的itemclick指定的处理方法名称 if(e.detail.node.name == 'a') { let url = e.detail.node.attrs.href let jumpurl = '/jumpurl?url='+encodeURIComponent(url ) //这里我直接拉起系统浏览器访问,也可以利用 uni.navigateTo在app内部跳转 this.openLink(jumpurl) }}
对付rich-text是利用节点数组还是字符串,根据自己需求而定,如果字符串的话,可以直接写个正则更换。比如:
function replaceLinks(text) { // 正则表达式匹配<a>标签的href属性 // 把稳:这个正则表达式可能无法处理所有繁芜的HTML情形 var regex = /<a\s+[^>]href=(\"??)([^\" >]?)(\"??)[^>]>([^<])<\/a>/gi; return text.replace(regex, function(match, quote1, url, quote2, textInside) { // 验证URL(可选,取决于你的需求) if (url) { // 更换为新的链接格式 return '<a href="/jumpurl?url=' + encodeURIComponent(url) + '">' + textInside + '</a>'; } return match; }); } content = replaceLinks(content);
不过我建议用数组节点,后端将富文本处理为节点数组返回给前端,这样有两个好处,一是前端处理起来比较方便 ,其余一点便是性能问题,后端处理好之后,前端直策应用数组,性能会更好。这点官方文档也有解释:“nodes 值为 HTML String 时,在组件内部将自动解析为节点列表,推举直策应用 Array 类型避免内部转换导致的性能低落”。不过要将一段HTML富文本处理成节点数组,对后端来说,也是比较麻烦的,如果利用PHP,可利用PHP DOMDocument,参考我前面的例子。uni-app中的富文本rich-text利用履历 AI小站。如果是python可以利用BeautifulSoup处理,java可以利用Jsoup。