react + typescript 想用 tagged union 来约束 react 组件的 props，实现某两个属性同时有或者同时没有，但是 switch tag 以后好像没法做到类型收窄？

type BaseProps = {
    ref: React.Ref<HTMLDivElement>
    onClick: (id: number) => React.MouseEventHandler<HTMLDivElement>
}

type MyProps = 
  | BaseProps & {type: 'a', length: number ...}
  | BaseProps & {type: 'b', width: number ...}

class MyComponent extends PureComponent<MyProps> {
  
  render() {
    const {type} = this.props;
    
    switch (type) {
      case 'a': {
        const {length} = this.props 
      }
  }
}

取 length 的地方就报错，说找不到这个属性

TS2339: Property 'length' does not exist on type 'Readonly{ children?: ReactNode; }> & Readonly '.

是不支持这样写还是我的写法有问题