typescript - Typescript - 输出类型取决于输入类型
问题描述
我有一个检查输入字段有效性的功能。
export const getInputValidity = (inputData:DeepReadonly<InputData> , val:string) => {
const {length} = val
if (inputData.type==="select"){
return val.length<5
}
if (inputData.type==="email"){
return {
validEdit: !length || isExp(val, /^[a-zA-Z0-9!#$%&'*+-/=?^_`{|}~."(),:;<>@[\]]+$/),
validFinal: length && isExp(val, COMMON_REGEX.email)
}
}
}
我希望输出取决于输入
const validity = getInputValidity(EMAIL_INPUT_DATA, emailVal )
所以如果EMAIL_INPUT_DATA.type==="email"
我想要有效性的类型将是
{
validEdit: boolean
validFinal: boolean
}
可能吗?当前有效性键入为
const validity: true | {
readonly validEdit: boolean;
readonly validFinal: boolean | 0;
readonly validLength?: undefined;
readonly validChars?: undefined;
} | {
readonly validLength: boolean;
readonly validChars: boolean;
readonly validEdit?: undefined;
readonly validFinal?: undefined;
}
我知道这可以通过键入 getInputValidity 作为函数来完成,但是可以从实现中推断出来吗?
解决方案
您可以使用函数重载来执行此操作:
const isExp = (s: String, r: RegExp) => true;
interface IValidityReturn {
validEdit: boolean;
validFinal: boolean;
}
function getInputValidity(inputData: { type: 'select' }, val: string): boolean;
function getInputValidity(inputData: { type: 'select' }, val: string): boolean;
function getInputValidity(inputData: { type: 'select' | 'email' }, val: string): boolean | IValidityReturn {
const { length } = val
if (inputData.type==="select"){
return val.length<5
}
if (inputData.type==="email"){
return {
validEdit: !length || isExp(val, /^[a-zA-Z0-9!#$%&'*+-/=?^_`{|}~."(),:;<>@[\]]+$/),
validFinal: !!length && isExp(val, /a/g),
}
}
// only to make example work:
return {
validEdit: false,
validFinal: false,
}
}
为了示例的目的,将其中一些部分拼凑在一起,但似乎这应该可以解决问题。
推荐阅读
- angular - 暂停一个间隔 rxjs
- python - 对齐 QPushButton 中的图标
- elasticsearch - 是否有弹性搜索标准解决方案来加载最近更改的关系数据
- react-native - React Natie,当我在 componentWillUnmount 上使用 useState 数据时,只获取第一个数据
- php - 如何使用数据表快速加载大量数据?
- pyspark - 用相同的键解析json到不同的列
- mysql - 如何获取两个 mysql 转储之间的差异并更新增量?
- python - 使用 windows PoweShell 并行处理 8 个 python 进程 {}-section
- laravel - 如何从 YAML 文件中调用 laravel 变量?
- url-rewriting - EspoCRM 报错 可能的问题:禁用 URL Rewrite