Reactjs 在保留原始类型的同时约束类型？ 从“react”导入{cssprroperties}； 类型StyleRulesType=Partial 类型StylesDefinition={[key:string]：StyleRulesType}； 常量样式：样式定义={ 名单：{ 位置：'相对'， }, 列表计数：{ 字体：“斜体” } } type StyleKeys=typeof styles的keyof；

我试图将样式约束为仅包含CSSProperties标签和值的子项，这是通过StylesDefinition约束实现的

我正在尝试将键设置为“list”|“listitem”，当样式不受样式定义的约束时，这种方法就可以工作

我希望通过约束来帮助填充样式变量和值，同时我希望能够在引用styles对象时进行类型检查，以便只能使用styles.list和styles.listCount

---

很高兴介绍更多类型和方法来实现我的目标。

您不能既约束变量的类型，又对其类型进行推断。通常的方法是使用一个函数，该函数可以具有一个既受约束又可推断的类型参数：

import { CSSProperties } from 'react';
type StyleRulesType = Partial<CSSProperties>

type StylesDefinition = { [key: string]: StyleRulesType };


const styles: StylesDefinition = {
    list: {
        position: 'relative',
    },
    listCount: {
        fontStyle: 'italic'
    }
}

type StyleKeys = keyof typeof styles;

从“react”导入{cssprroperties}；
类型StyleRulesType=Partial
类型StylesDefinition={[key:string]：StyleRulesType}；
函数createStyleDefinition（o:T）{
返回o；
}
const styles=createStyleDefinition({
名单：{
位置：'相对'，
},
列表计数：{
字体：“斜体”
}
})
type StyleKeys=typeof styles的keyof；

import { CSSProperties } from 'react';
type StyleRulesType = Partial<CSSProperties>

type StylesDefinition = { [key: string]: StyleRulesType };
function createStyleDefinition<T extends StylesDefinition>(o: T) {
    return o;
}

const styles = createStyleDefinition({
    list: {
        position: 'relative',
    },
    listCount: {
        fontStyle: 'italic'
    }
})

type StyleKeys = keyof typeof styles;