0
点赞
收藏
分享

微信扫一扫

实现文本内容是超链接时自动转换为超链接

_karen 2022-01-12 阅读 45

文本内容出现超链接时,自动让其变成超链接
解决办法:
使用自定义指令实现数据过滤转化为超链接

// 自定义指令 全局指令,引用就自行引用了
import Vue form 'vue'
Vue.directive('openLink', {
	bind(el) {
		// 获取内容
		let textR = el.innerText
		// 判断内容是否为空
		if (textR.length) {
			// 匹配超链接正则
			let reg = /(https?|ftp|file)(:\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|])/g;
			let arr = textR.math(reg) || []
			if (arr.length) {
				textR = textR.replace(reg, "<a href='$1$2' target='_blank'>$1$2</a>");
			}
			el.innerHTML = textR
		}
	}
})
举报

相关推荐

超链接title文本换行

超链接<a></a>

HTML超链接

web 学习之 超链接文本

超链接标签

0 条评论