react+ts 传参类型问题

Question

子组件

props:{
   type:'count' | 'time'

}

调用

<component type='count'/> //正确

const a='count'
<component type={a}/>// 错误 无法将string类型赋予 count | time 

这个问题该如何解决 type 是动态的

Answer 1

指定类型：

const a: 'count' | 'time' = 'count';

嫌啰嗦可以写个 type：

type ComponentType = 'count' | 'time';

// 子组件
props: {
   type: ComponentType 
}

// 父组件
const a: ComponentType = 'count';