首页 » SEO优化 » phprichtext技巧_uniapp中运用富文本richtext的小我经验

phprichtext技巧_uniapp中运用富文本richtext的小我经验

访客 2024-11-25 0

扫一扫用手机浏览

文章目录 [+]

先说一下“selectable” 长按选择区域复制,这个我在APP项目中 不起浸染,可能像文档说的,只支持“百度小程序”吧。
在APP端起浸染的话,可以做如下修正,在样式中添加下面样式代码

.content-select-copy { -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;}

模板中调用的时候加上面样式

phprichtext技巧_uniapp中运用富文本richtext的小我经验

<view class="content-select-copy" > <rich-text :selectable='true' :nodes="content" @itemclick="handleRichText"></rich-text></view>

这样就可以在APP端实现长按选择区域复制了。

phprichtext技巧_uniapp中运用富文本richtext的小我经验
(图片来自网络侵删)

然后再说一下事宜处理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。

标签:

相关文章

介绍百度网盘,云端存储时代的创新先锋

随着互联网技术的飞速发展,云计算已经成为现代生活不可或缺的一部分。而在这其中,百度网盘作为国内领先的云存储服务提供商,以其卓越的性...

SEO优化 2025-01-03 阅读3 评论0

介绍监控屏蔽技术,守护个人隐私的利器

随着科技的发展,监控设备已经深入到我们生活的方方面面。在享受便利的隐私安全问题也日益凸显。如何有效屏蔽监控,保护个人隐私,成为人们...

SEO优化 2025-01-03 阅读3 评论0

介绍番号观看方法,轻松驾驭影视世界

随着互联网的普及,网络影视资源日益丰富,番号作为影视作品的标识码,已经成为广大观众了解、搜索和观看影视作品的重要途径。如何正确地使...

SEO优化 2025-01-03 阅读1 评论0

介绍盗微信号黑幕,网络安全的严峻挑战

在数字化时代,微信已成为人们生活中不可或缺的通讯工具。随着微信用户数量的激增,盗微信号的事件也日益增多。本文将深入剖析盗微信号的方...

SEO优化 2025-01-03 阅读1 评论0