文本内容出现超链接时,自动让其变成超链接
解决办法:
使用自定义指令实现数据过滤转化为超链接
在min.js定义全局自定义指令
// 自定义指令 全局指令,引用就自行引用了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}}})
使用
<span v-open-link>前面这些文字不会有超链接,从下面开始就会转换为超链接了 </span>