Wie verwende ich Prop-Typen als Typdefinition in Typoskript?

Lösung:

Wir können benutzen InferProps von @types/prop-types Paket zum Extrahieren des Rohtyps aus Objekten des Requisitentyps, wie:

import PropTypes, { InferProps } from 'prop-types'

const myTypes = {
  activeColor: PropTypes.string,
  // ...
}

type MyComponentProps = InferProps<typeof myTypes>

const dark_theme_properties: MyComponentProps = {
  activeColor: 'green'
  // ...
};

Da Sie Typescript verwenden, können Sie eine Schnittstelle als Typ-Helfer und Autovervollständigung erstellen.

import React from 'react'

export interface myTypes {
  activeColor: string;
  color: string;
  fontFamily: string;
  fontSize: number;
  fontWeight: string | number;
  height: number;
  icon: React.ReactNode;
  iconOverlay: React.ReactNode;
  marginBottom: number;
  marginLeft: number;
  marginRight: number;
  marginTop: number;
  maxHeight: number;
  minHeight: number;
  onBlur: () => void;
  onChangeText: () => void;
  paddingBottom: number;
  paddingLeft: number;
  paddingRight: number;
  paddingTop: number;
}

import { myTypes } from "my-types-interface";

const dark_theme_properties: myTypes = {
  activeColor: "green",
  ...
};

---

---

Anderer Beitrag