React + Typescript + antd 按钮组件type属性延申属性问题

Question

渲染函数里，我使用了antd UI的Button组件
<Button size='middle' {...this.getNavStandProps(1)}>领取</Button>

我想使用getNavStandProps方法来返回扩展Button属性className与type

getNavStandProps(navId : number) {
    const { active } =this.props;
    if(navId ===active) {
        return {
            type:'primary'
        }
    }else {
        return {
            className:'_el-btn-disabled'
        }
    }
}

在build时报错
Types of property 'type' are incompatible.

  Type 'string' is not assignable to type '"primary" | "link" | "ghost" | "danger" | "default" | "dashed" | undefined'. 
  

如返回className就不会报错，不知道什么原因

Answer 1

改为下面这种即可

typeButtonProps\={

type?: "primary"|"link"|"ghost"|"danger"|"default"|"dashed"|undefined,

  className?: string

}

  

constMyButton\=()\=>{

const getNavStandProps \=(navId:number):ButtonProps\=>{

const{ active }\=this.props;

if(navId \===active){

return{

type:'primary'

}

}else{

return{

              className:'\_el-btn-disabled'

}

}

}

  

return<Button size\='middle'{...getNavStandProps(1)}>领取</Button\>

}