有没有办法使用流来限制特定的字符串模式？答案

【问题标题】：Is there any way to use flow to restrict specific string patterns?有没有办法使用流来限制特定的字符串模式？
【发布时间】：2019-04-30 02:54:42
【问题描述】：

我在 React webapp 上使用 Flow，我目前正面临一个用例，我要求用户以“HH:mm”格式输入某些时间值。有什么方法可以描述字符串遵循的模式吗？

我一直在寻找解决方案，但我在某一点上同意的普遍共识似乎是您不需要使用 Flow 来处理这种事情，而是倾向于使用验证函数并依赖UI 代码以按照正确的模式提供代码。不过，我想知道是否有任何方法可以实现这一点，以使代码尽可能具有描述性。

【问题讨论】：

如果你想创建一个所有可能的字符串的联合类型，但是没有一个好的方法可以在 Flow 中键入一个通用模式。例如，您可以使用type ValidInput = '00:00' | '00:01' | '00:02' | ... | '24:59'，但不能使用type ValidInput = <regex pattern>。
在这种情况下，所有可能的字符串可能性的联合类型绝对不可行...

标签： reactjs flowtype

【解决方案1】：

您想创建一个验证器函数，但使用不透明类型别名进行了增强：https://flow.org/en/docs/types/opaque-types/

或者，更具体地说，具有子类型约束的不透明类型别名：https://flow.org/en/docs/types/opaque-types/#toc-subtyping-constraints

您应该在定义 opaque 类型的同一文件中编写验证器函数。它将接受原始类型作为参数并返回一个类型为具有子类型约束的不透明类型的值。

现在，在不同的文件中，您可以将一些变量键入为不透明类型，例如在函数参数中。 Flow 将强制您只传递通过验证器函数的值，但这些值可以像原始类型一样使用。

例子：

exports.js:

export opaque type ID: string = string;


function validateID(x: string): ID | void {
    if ( /* some validity check passes */ ) {
        return x;
    }

    return undefined;
}

import.js:

import type {ID} from './exports';

function formatID(x: ID): string {
    return "ID: " + x; // Ok! IDs are strings.
}

function toID(x: string): ID {
    return x; // Error: strings are not IDs.
}

【讨论】：