React PropTypes - 只允许对象值之一？

Question

考虑有一个键和值映射对象，如下所示：

export const PlaceholderVisibility = {
  Always: undefined,
  Never: null,
  OnFocus: true,
  OnBlur: false
}

您将如何使用PropTypes仅允许现有对象中指定的值？

这是我尝试过的：

import PropTypes from 'prop-types';
export const myTypes = {
  // ...
  visibility: PropTypes.oneOf(PlaceholderVisibility)
}

但我目前正在使用，PropTypes.bool因为这似乎适用于这种情况，但是当例如其中一个值是字符串类型时，这仍然不起作用。

Answer 1

object要仅允许 -中的值之一，您可以像这样React PropTypes使用：PropTypes.oneOfObject.values()

import PropTypes from 'prop-types';

export const PlaceholderVisibility = {
  Always: 'always',
  Never: 'never',
  OnFocus: 'on-focus',
  OnBlur: 'on-blur'
}

export const myTypes = {
  // ...
  visibility: PropTypes.oneOf(Object.values(PlaceholderVisibility))
}

注意，上面的语句等同于：

export const myTypes = {
  // ...
  visibility: PropTypes.oneOf([
   'always',
   'never',
   'on-focus',
   'on-blur'
  ])
}

因此，最好values在您的对象中具有相当独特的属性，以避免误用。例如，如果有人直接传递像'always'字符串这样的值 - React 不会抱怨。