Why does React.createRef() for material-ui Button element in TypeScript not work correctly?

user_94508 0
Viewed 1047

Using React v16.13.1 I have the following component class with a Material-UI Button component and a RefObject to access the button element.

class Search extends React.Component<any, any>{

  constructor(props: any) {
    super(props)

    this.streetViewRef = React.createRef();
  }

  private streetViewRef: React.RefObject<Button>;
}

for the following Button element

<Button ref={this.streetViewRef} size="sm" variant="primary" block >Street View</Button>

However, the following TypeScript error is displayed.

enter image description here

What needs to be changed to correct this error?

material-ui typescript reactjs
2 Answers
user_3439000

You need to create ref with HTMLDivElement.

createRef<HTMLDivElement>()

So, this would be better.

private streetViewRef = createRef<HTMLDivElement>();
user_95930330
Related