reactjs - 使用 TS 在 RN 中设置类型

Question

在我的 RN 应用程序中，我有以下界面。

interface IProps extends Props<IProps> {
  label?: string;
  editable?: boolean;
  maxLength?: number;
  autoCorrect?: boolean;
  placeholder?: string;
  // tslint:disable-next-line: max-line-length
  autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters' | undefined;
  // tslint:disable-next-line: max-line-length
  returnKeyType?: 'none' | 'done' | 'search' | 'default' | 'go' | 'next' | 'send' | 'previous' | 'google' | 'join' | 'route' | 'yahoo' | 'emergency-call';
  // tslint:disable-next-line: max-line-length
  keyboardType?: 'default' | 'email-address' | 'numeric' | 'phone-pad' | 'visible-password' | 'ascii-capable' | 'numbers-and-punctuation' | 'url' | 'number-pad' | 'name-phone-pad' | 'decimal-pad' | 'twitter' | 'web-search' | undefined;
  secureTextEntry?: boolean;
  inputStyle?: object;
  containerStyle?: object;
  inputContainerStyle?: object;
}

这里的autoCapitalize，returnKeyType类型是枚举。在这里定义整个枚举似乎很难看。有没有更好的方法？

Answer 1

试试这个:

enum AutoCapitalize {
  NONE = 'none',
  SENTENCES = 'sentences',
  WORDS = 'words',
  CHARACTERS = 'characters',
  UNDEFINED = '',
}

enum ReturnKeyType {
  ...
}

interface IProps extends Props<IProps> {
  label?: string;
  editable?: boolean;
  maxLength?: number;
  autoCorrect?: boolean;
  placeholder?: string;
  // tslint:disable-next-line: max-line-length
  autoCapitalize?: AutoCapitalize;
  ...
}