当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript prop-types.oneOfType函数代码示例

本文整理汇总了TypeScript中prop-types.oneOfType函数的典型用法代码示例。如果您正苦于以下问题:TypeScript oneOfType函数的具体用法?TypeScript oneOfType怎么用?TypeScript oneOfType使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。


在下文中一共展示了oneOfType函数的7个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: styled

const Grid = styled(Box)<GridProps>`
  display: grid;
  &&& {
    ${bool("grid-auto-flow", ["row", "column", "dense"])}
    ${value("grid-gap", "gap")}
    ${value("grid-template", "template")}
    ${value("grid-template-areas", "areas")}
    ${value("grid-template-columns", "columns")}
    ${value("grid-template-rows", "rows")}
    ${value("grid-auto-columns", "autoColumns")}
    ${value("grid-auto-rows", "autoRows")}
  }
  ${theme("Grid")};
`;

const valueType = PropTypes.oneOfType([PropTypes.string, PropTypes.number]);

// @ts-ignore
Grid.propTypes = {
  row: PropTypes.bool,
  column: PropTypes.bool,
  dense: PropTypes.bool,
  gap: valueType,
  template: valueType,
  areas: valueType,
  columns: valueType,
  rows: valueType,
  autoColumns: valueType,
  autoRows: valueType
};
开发者ID:IgorCRD,项目名称:reakit,代码行数:30,代码来源:Grid.ts

示例2: styled

import Box from "../Box";
import CardFit from "./CardFit";

export interface CardProps {
  gutter?: number | string;
}

const Card = styled(Box)<CardProps>`
  display: inline-block;

  && > *:not(${getSelector(CardFit)}) {
    margin: ${withProp("gutter", numberToPx)};
  }

  ${theme("Card")};
`;

// @ts-ignore
Card.propTypes = {
  gutter: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
};

Card.defaultProps = {
  gutter: "1rem",
  opaque: true,
  palette: "background",
  tone: -1
};

export default as("div")(Card);
开发者ID:IgorCRD,项目名称:reakit,代码行数:30,代码来源:Card.ts

示例3:

   *
   * `transform([{ rotateX: '45deg' }, { rotateZ: '0.785398rad' }])`
   *
   * The skew transformations require a string so that the transform may be
   * expressed in degrees (deg). For example:
   *
   * `transform([{ skewX: '45deg' }])`
   */
  transform: ReactPropTypes.arrayOf(
    ReactPropTypes.oneOfType([
      ReactPropTypes.shape({perspective: ReactPropTypes.number}),
      ReactPropTypes.shape({rotate: ReactPropTypes.string}),
      ReactPropTypes.shape({rotateX: ReactPropTypes.string}),
      ReactPropTypes.shape({rotateY: ReactPropTypes.string}),
      ReactPropTypes.shape({rotateZ: ReactPropTypes.string}),
      ReactPropTypes.shape({scale: ReactPropTypes.number}),
      ReactPropTypes.shape({scaleX: ReactPropTypes.number}),
      ReactPropTypes.shape({scaleY: ReactPropTypes.number}),
      ReactPropTypes.shape({translateX: ReactPropTypes.number}),
      ReactPropTypes.shape({translateY: ReactPropTypes.number}),
      ReactPropTypes.shape({skewX: ReactPropTypes.string}),
      ReactPropTypes.shape({skewY: ReactPropTypes.string})
    ])
  ),

  /**
   * Deprecated. Use the transform prop instead.
   */
  transformMatrix: TransformMatrixPropType,
  /**
   * Deprecated. Use the transform prop instead.
   */
开发者ID:YangShaoQun,项目名称:taro,代码行数:32,代码来源:TransformPropTypes.ts

示例4:

/* Automatically generated by shapeshifter. Do not modify! */
/* eslint-disable */

import PropTypes from 'prop-types';
import Schema from 'shapeshifter';

export const KeyShape = PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.number,
]);

export type Key = string | number;

export const multipleChildrenSchema = new Schema<MultipleChildrenShape>('multiple-children', 'uuid');

export const singleChildSchema = new Schema<SingleChildShape>('single-child');

export const parentSchema = new Schema<ParentShape>('parents');

singleChildSchema
  .hasOne({
    self: singleChildSchema,
  });

parentSchema
  .morphTo({
    Single: singleChildSchema,
    'Model::Multiple': multipleChildrenSchema,
  }, 'polymorph', '_type', '_fk')
  .belongsToMany({
    children: multipleChildrenSchema,
开发者ID:milesj,项目名称:shapeshifter,代码行数:31,代码来源:infer-and-schema-generics.ts

示例5:

const LayoutPropTypes = {
  /** `display` sets the display type of this component.
   *
   *  It works similarly to `display` in CSS, but only support 'flex' and 'none'.
   *  'flex' is the default.
   */
  display: ReactPropTypes.oneOf(['none', 'flex']),

  /** `width` sets the width of this component.
   *
   *  It works similarly to `width` in CSS, but in React Native you
   *  must use points or percentages. Ems and other units are not supported.
   *  See https://developer.mozilla.org/en-US/docs/Web/CSS/width for more details.
   */
  width: ReactPropTypes.oneOfType([
    ReactPropTypes.number,
    ReactPropTypes.string
  ]),

  /** `height` sets the height of this component.
   *
   *  It works similarly to `height` in CSS, but in React Native you
   *  must use points or percentages. Ems and other units are not supported.
   *  See https://developer.mozilla.org/en-US/docs/Web/CSS/height for more details.
   */
  height: ReactPropTypes.oneOfType([
    ReactPropTypes.number,
    ReactPropTypes.string
  ]),

  /**
   * When the direction is `ltr`, `start` is equivalent to `left`.
开发者ID:YangShaoQun,项目名称:taro,代码行数:32,代码来源:LayoutPropTypes.ts

示例6:

// TS checking
const propTypes: PropTypesMap = {
    any: PropTypes.any,
    array: PropTypes.array.isRequired,
    bool: PropTypes.bool.isRequired,
    element: PropTypes.element.isRequired,
    func: PropTypes.func.isRequired,
    node: PropTypes.node,
    requiredNode: PropTypes.node.isRequired,
    number: PropTypes.number.isRequired,
    object: PropTypes.object.isRequired,
    string: PropTypes.string.isRequired,
    symbol: PropTypes.symbol.isRequired,
    instanceOf: PropTypes.instanceOf(TestClass).isRequired,
    oneOf: PropTypes.oneOf<'a' | 'b' | 'c'>(['a', 'b', 'c']).isRequired,
    oneOfType: PropTypes.oneOfType(arrayOfTypes).isRequired,
    numberOrFalse: PropTypes.oneOfType([PropTypes.oneOf<false>([false]), PropTypes.number]).isRequired,
    // The generic function type (() => any) is assignable to ReactNode because ReactNode extends the empty object type {}
    // Which widens the array literal of validators to just Array<Requireable<() => any>>
    // It's too risky to change ReactNode to exclude {} even though it's invalid, as it's required for children-as-function props to work
    // So we assert the explicit tuple type
    nodeOrRenderFn: PropTypes.oneOfType([PropTypes.node, PropTypes.func] as [PropTypes.Requireable<ReactNode>, PropTypes.Requireable<() => any>]),
    arrayOf: PropTypes.arrayOf(PropTypes.bool.isRequired).isRequired,
    objectOf: PropTypes.objectOf(PropTypes.number.isRequired).isRequired,
    shape: PropTypes.shape(innerProps).isRequired,
    optionalNumber: PropTypes.number,
    customProp: (() => null) as PropTypes.Validator<typeof uniqueType | undefined>
};

// JS checking
const propTypesWithoutAnnotation = {
开发者ID:Jeremy-F,项目名称:DefinitelyTyped,代码行数:31,代码来源:prop-types-tests.ts

示例7:

    bar: PropTypes.bool,
    baz: PropTypes.any
};

const arrayOfTypes = [PropTypes.string, PropTypes.bool, PropTypes.shape({
    foo: PropTypes.string,
    bar: PropTypes.number.isRequired
})];

// TS checking
const propTypes: PropTypesMap = {
    any: PropTypes.any,
    array: PropTypes.array.isRequired,
    bool: PropTypes.bool.isRequired,
    shape: PropTypes.shape(innerProps).isRequired,
    oneOfType: PropTypes.oneOfType(arrayOfTypes).isRequired,
};

// JS checking
const propTypesWithoutAnnotation = {
    any: PropTypes.any,
    array: PropTypes.array.isRequired,
    bool: PropTypes.bool.isRequired,
    shape: PropTypes.shape(innerProps).isRequired,
    oneOfType: PropTypes.oneOfType(arrayOfTypes).isRequired,
};

type ExtractedProps = PropTypes.InferProps<typeof propTypes>;

type ExtractedPropsWithoutAnnotation = PropTypes.InferProps<typeof propTypesWithoutAnnotation>;
开发者ID:HerringtonDarkholme,项目名称:TypeScript,代码行数:30,代码来源:propTypeValidatorInference.ts


注:本文中的prop-types.oneOfType函数示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。