Question

我已经创建了这个辅助函数：

echo $array['upload_data']['filename'];

我想按如下方式使用它：

export function createStyleUtilForProp<TProps, K extends keyof TProps>(
  prop: K,
  style: ((val: TProps[K]) => RNStyle) | RNStyle,
) {
  return (props: TProps) => {
    if (typeof style === 'function') {
      return style(props[prop]);
    }
    return props[prop] ? style : null;
  }
}

但是，这将引发以下错误： type Props = { border?: number; color?: string, } const getBorderStyle = createStyleUtilForProp<Props>('border', (border) => ({ borderWidth: border, borderColor: '#000000', }));

解决此问题的唯一方法是添加索引prop的类型：

TS2558: Expected 2 type arguments, but got 1.

我不喜欢两次输入const getBorderStyle = createStyleUtilForProp<Props, 'border'>('border', ...);。 TS可以从参数中推断出索引类型吗？

Answer 1

至少在3.3以上（撰写本文时的下一个版本）中，打字稿中不支持部分推断。

有一个提议允许为3.4（如详细的here）计划部分推理，但是从3.1开始，它已经回落，因此不确定何时引入。有了这个建议，您也许可以写（我说的是根据问题中描述的行为推测的）；

const getBorderStyle = createStyleUtilForProp<Props, _>('border', (border) => ({
    borderWidth: border,
    borderColor: '#000000',
}));

在不支持部分推断之前，通常的解决方法是使用返回函数的函数。在第一个调用中，您指定T，在第二个调用中，编译器推断K：

export function createStyleUtilForProp<TProps>() {

    return function <K extends keyof TProps>(
        prop: K,
        style: ((val: TProps[K]) => RNStyle) | RNStyle,
    ) {
        return (props: TProps) => {
            if (typeof style === 'function') {
                return style(props[prop]);
            }
            return props[prop] ? style : null;
        }
    }
}
type Props = {
    border?: number;
    color?: string,
}

const getBorderStyle = createStyleUtilForProp<Props>()('border', (border) => ({
    borderWidth: border,
    borderColor: '#000000',
}));

从参数部分推断通用索引类型

1 个答案: