TypeScript 实践中常见的问题

Question

导入 svg

在全局中添加声明：

declare module '*.svg' {
  const content: string
  export default content
}

Answer 1

交叉类型中复写类型应该使用 omit 排除相同的 key
交叉类型，每一项的 key 也会进行交叉操作，不排除可能造成类型错误

[❌] type BasicProps = {
  onChange?: (value: string, e: React.MouseEvent<HTMLInputElement>) => void;
}
type SelfProps = {
onChange?: (value: number | string) => void;
}

type IProps = BasicProps & SelfProps

[✅] type BasicProps = {
  onChange?: (value: string, e: React.MouseEvent<HTMLInputElement>) => void;
}
type SelfProps = {
onChange?: (value: number | string) => void;
}

type IProps = Omit<BasicProps, 'onChange'> & SelfProps

Answer 2

react-router withRouter 的使用

export interface HandleNodeSideContentProps extends RouteComponentProps {
  queue?: string[];
  strategyStore?: IStrategyStore;
}


export default withRouter<HandleNodeSideContentProps>(HandleNodeSideContent);