TS 代码实现 正则匹配 [0-9]{1,3}-[0-9]{1,3}

在 TypeScript 中，可以使用 `RegExp` 对象来进行正则表达式的匹配。可以使用 `test` 方法来判断一个字符串是否匹配某个正则表达式，或者使用 `exec` 方法来获取匹配到的结果。下面是一个实现正则匹配 `[0-9]{1,3}-[0-9]{1,3}` 的 TypeScript 代码示例：

const str: string = '12-345'; // 待匹配的字符串
const regex: RegExp = /^[0-9]{1,3}-[0-9]{1,3}$/; // 定义正则表达式
if (regex.test(str)) {
  console.log('匹配成功');
} else {
  console.log('匹配失败');
}

在这个例子中，我们使用了一个正则表达式 `/^[0-9]{1,3}-[0-9]{1,3}$/`，其中：

- `^` 表示匹配字符串的开头。
- `[0-9]{1,3}` 表示匹配 1 到 3 个数字字符。
- `-` 表示匹配一个连字符。
- `[0-9]{1,3}` 表示匹配 1 到 3 个数字字符。
- `$` 表示匹配字符串的结尾。

因此，这个正则表达式可以匹配格式为 `x-y` 的字符串，其中 x 和 y 是 1 到 3 个数字字符。在代码中，我们使用 `test` 方法来判断待匹配的字符串是否符合这个正则表达式，如果匹配成功则输出 `匹配成功`，否则输出 `匹配失败`。

相关问题

字符串ts斜杠1 1 0 22 使用正则匹配获取版本号1 1 0 22

可以使用正则表达式来匹配版本号，例如：

import re

ts = "字符串ts斜杠1 1 0 22"
version_pattern = r"\d+\s+\d+\s+\d+\s+\d+"
version = re.search(version_pattern, ts).group()

print(version)  # 输出：1 1 0 22

这段代码会从字符串 `ts` 中匹配出版本号，并将其打印出来。正则表达式 `r"\d+\s+\d+\s+\d+\s+\d+"` 表示匹配四个数字，每两个数字之间用一个或多个空格分隔。

VUE3输入框格式化(xxx) xxx-xxxx

以下是使用 Vue 3 中的 Composition API 对输入框进行格式化的代码示例：

<template>
  <div>
    <label for="phone">Phone:</label>
    <input id="phone" v-model="formattedPhone" @input="onPhoneInput" />
  </div>
</template>

<script lang="ts">
import { ref, watch } from 'vue';

export default {
  setup() {
    const phone = ref('');
    const formattedPhone = ref('');

    const formatPhone = (value: string) => {
      const regex = /^(\d{0,3})(\d{0,3})(\d{0,4})$/;
      const match = value.match(regex);
      if (match) {
        formattedPhone.value = `(${match[1]}) ${match[2]}-${match[3]}`;
      } else {
        formattedPhone.value = value;
      }
    };

    const onPhoneInput = (event: InputEvent) => {
      const target = event.target as HTMLInputElement;
      const value = target.value.replace(/\D/g, '');
      phone.value = value;
    };

    watch(phone, (value: string) => {
      formatPhone(value);
    });

    return {
      phone,
      formattedPhone,
      onPhoneInput,
    };
  },
};
</script>

解释一下：

- 我们使用 Vue 3 中的 Composition API 来编写组件。
- `phone` 和 `formattedPhone` 都是响应式变量，分别保存未格式化和格式化后的电话号码。
- `formatPhone` 函数接受一个字符串参数 `value`，将其格式化为 `(xxx) xxx-xxxx` 的电话号码，并将其保存在 `formattedPhone` 变量中。
- 正则表达式 `^(\d{0,3})(\d{0,3})(\d{0,4})$` 匹配一个最多十位数字的电话号码，其中：
- `^` 表示字符串的开始。
- `(\d{0,3})` 表示一个至多三位数字的组。
- `(\d{0,3})` 表示另一个至多三位数字的组。
- `(\d{0,4})` 表示一个至多四位数字的组。
- `$` 表示字符串的结尾。
- 如果 `value` 符合正则表达式的格式，则使用 `match` 方法将其分成三个组，并返回格式为 `(xxx) xxx-xxxx` 的电话号码。
- 如果 `value` 不符合正则表达式的格式，则将其保存在 `formattedPhone` 变量中。
- `onPhoneInput` 函数接受一个 `InputEvent` 参数 `event`，将输入框的值 `value` 替换为仅包含数字的字符串，并将其保存在 `phone` 变量中。
- `watch` 函数监听 `phone` 变量的变化，并在变化时调用 `formatPhone` 函数来格式化电话号码。
- 最后，在模板中使用 `v-model` 指令将 `formattedPhone` 绑定到输入框上，并使用 `@input` 事件监听输入框的输入。