Reactjs 选择样式和类型脚本

根据，我可以访问传递到Select body的我自己的参数，如下所示：

const customStyles={
菜单：（提供，状态）=>({
假如
宽度：state.selectProps.width，
borderBottom:“1px点粉色”，
颜色：state.selectProps.menuColor，
填充：20，
}),
控件：（{selectProps:{width}}）=>({
宽度：宽度
}),
singleValue：（提供，状态）=>{
常数不透明度=state.isDisabled？0.5:1；
常量转换=‘不透明度300ms’；
返回{…提供，不透明度，转换}；
}
}

但是如果我在typescript中有这样的东西

const customStyles:SelectProps[“styles”]={
valueContainer：（提供，{selectProps:{size}}）=>{
常数px={
sm：“0.75雷姆”，
md:“1rem”，
lg：“1rem”
};
返回{
假如
填充：`0.125rem${px[size]}`
};
},
};

${px[size]}

部分抛出错误

---

元素隐式地有一个“any”类型，因为类型“any”的表达式不能用于索引类型“{sm:string；md:string；lg:string；}”。

它表示传入的

大小

是一个

any

类型，typescript不知道它是否是

sm

md

lg

的键之一

方式01：使用

cast

通知typescript，大小是

sm

md

lg

const px = {
  sm: "0.75rem",
  md: "1rem",
  lg: "1rem"
};

px[size as 'sm' | 'md' | 'lg']

方式02：为

px设置一个类型，并使用其键进行铸造

type PxType = { [k in 'sm' | 'md' | 'lg']: string }

const px: PxType = {
  sm: "0.75rem",
  md: "1rem",
  lg: "1rem"
};

px[size as keyof PxType]