Reactjs 如何在React Typescript中允许某些道具组合?
我有两个枚举:Reactjs 如何在React Typescript中允许某些道具组合?,reactjs,typescript,types,react-props,Reactjs,Typescript,Types,React Props,我有两个枚举: enum Drink = { WATER = 0, COFFEE = 1, } enum Sugar = { LITTLE = 0, ALOT = 1, } enum Temperature = { COLD = 0, HOT = 1, } 我想要一个react组件,它只接受这个枚举的某些组合,而拒绝其他的 例如,我想接受: WATER & {HOT | COLD} COFFEE & {LITTLE | ALOT} 但我想拒绝: WATER &
enum Drink = {
WATER = 0,
COFFEE = 1,
}
enum Sugar = {
LITTLE = 0,
ALOT = 1,
}
enum Temperature = {
COLD = 0,
HOT = 1,
}
我想要一个react组件,它只接受这个枚举的某些组合,而拒绝其他的
例如,我想接受:
WATER & {HOT | COLD}
COFFEE & {LITTLE | ALOT}
但我想拒绝:
WATER & SUGAR
or
COFFEE & COLD
我尝试制作这种类型:
type someType = {
drink: Drink.WATER
temperature: Temperature.HOT | Temperature.COLD
} |
{
drink: Drink.COFFEE
sugar: Sugar.LITTLE | Sugar.ALOT
}
但这并不好
我希望将它们作为单独的道具,例如,当用户尝试键入:
<SpecificCompo drink={water} /*<-- here don't display sugar={} or if the user tries to type it, i want typescript to complain that type of water doesn't match with sugar --> */ />
有什么帮助吗
enum Drink {
WATER = 0,
COFFEE = 1,
}
enum Sugar {
LITTLE = 0,
ALOT = 1,
}
enum Temperature {
COLD = 0,
HOT = 1,
}
interface BaseProps {
// Whatever props
}
interface WaterProps extends BaseProps {
drink: Drink.WATER,
temperature: Temperature.HOT | Temperature.COLD
}
interface CoffeeProps extends BaseProps {
drink: Drink.COFFEE,
sugar: Sugar.LITTLE | Sugar.ALOT
}
export type ISpecificCompoProps = WaterProps | CoffeeProps;