打字稿：类型“字符串”不可分配给自定义类型

Question

I have a type like this,

interface StyleProps {
  display?: 'hide' | 'active'
}

and the type is being used by component below

<Section display={`${this.state.section !== 'chatbot' ? 'hide' : 'active'}`}>

display can only be hide or active but I'm still getting this error

 TS2322: Type 'string' is not assignable to type '"hide" | "active" | undefined'.

Is there any way to see what's in display or anything im doing it wrong?

Answer 1

如果删除模板文字并直接传递'hide'或'active'则可以消除此错误。

<Section display={this.state.section !== 'chatbot' ? 'hide' : 'active'}>