vue过滤和校验http链接的方法

https过滤
输入框粘贴含有网址链接的文本

例1: “0- 长按复制此条消息,打开抖音搜索,查看TA的更多作品。 https://v.douyin.com/BA4h4LF/”
返回:https://v.douyin.com/BA4h4LF/

例2: “0- 长按复制此条消息,打开抖音搜索,查看TA的更多作品。”
返回:0- 长按复制此条消息,打开抖音搜索,查看TA的更多作品。

说明:
1、输入的文本里包含链接就只返回链接,不包含就返回原文本
2、如果只想要链接,不包含链接的就输不上可自行改造下面方法,去掉else即可

 <input
    v-model="description"
    type="text"
    placeholder="请填写主页链接"
    @input="inputText"
  />
import { HTTPinput } from '@/utils/inputDispose';

// 主页链接校验
const inputText = (event: any) => {
  description.value = HTTPinput(event.detail.value);
};

//封装在工具库inputDispose.ts文件里
export const HTTPinput = function (values: any) {
  let str = '';
  const reg = /(https?|http|ftp|file):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/g;
  let url = values.match(reg);
  if (url && url.length > 0) {
    str = url[0];
  } else {
    str = values;
  }
  return str;
};

https校验 true false
对文本进行校验是否包含链接

import { HTTPIsBoolean} from '@/utils/inputDispose';

  //文本
  let str='0- 长按复制此条消息,打开抖音搜索,查看TA的更多作品。 https://v.douyin.com/BA4h4LF/';
  
  //调用方法
  let url = HTTPIsBoolean(str);
  if (!url) {
    uni.showToast({ title: '请输入正确的主页链接!', icon: 'none', duration: 2000 });
    return;
  }


//封装在工具库inputDispose.ts文件里
export const HTTPIsBoolean = function (values: any) {
  let str = true;
  const reg = /(https?|http|ftp|file):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/g;
  let url = values.match(reg);
  if (!url) {
    str = false;
  }
  return str;
};

你可能感兴趣的:(vue.js,前端,javascript)