Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Interface property dependent on other fields

$
0
0

I am making a reusable component for expo-vector-icons. This is the interface so far.

import { AntDesign, Entypom, Feather } from "@expo/vector-icons";type AppIconFamilies = {    AntDesign: typeof AntDesign;    Entypo: typeof Entypo;}export interface AppIconProps {    family?: keyof AppIconFamilies;    name?: React.ComponentProps<typeof AntDesign | typeof Entypo>["name"];}

I wanted to generate props for the same with typescript. But I see that I am duplicating the name field in AppIconProps interface. Is there any way to remove this duplication?

Basically, right now AntDesign and Entypo are there in the name field of AppIconProps interface. Suppose I want to also add Feather icons (which I imported on the top), so to add that what I will do is,

name?: React.ComponentProps<typeof AntDesign | typeof Entypo>["name"] | typeof Feather>["name"];

As you can see this does not look good, so is there any other way to write this interface?So that the name field should depend upon the family field?


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>