Issue on adding @types/react-notification-system in react/typescript

Question

I have used react-notification-system in React+Javascript, when I tried in React+Typescript it throws error as

Type 'ReactInstance' is not assignable to type 'null'
Type 'Element' is not assignable to type 'null'

in the line included in componentDidMount()

Patientadd.tsx

import * as NotificationSystem from 'react-notification-system';
class Patientadd extends React.Component<any, IState> {

public componentDidMount=()=>{
    this._notificationSystem = this.refs.notificationSystem;
  }

  _notificationSystem: null;
  _addNotification=(event)=> {
      this._notificationSystem.addNotification({
        message: event.message,
        title:event.title,
        level: event.level,
        autoDismiss: event.autoDismiss,
      });
  }
  public render() {
    return (
        <div className="App2">
          <NotificationSystem ref="notificationSystem" />
        </div>
    );
  }
}

Answer 1

Please try

import React from 'react';
import ReactDOM from 'react-dom';
import * as NotificationSystem from 'react-notification-system';

export default class Patientadd extends React.Component<any, IState> {
  notificationSystem = React.createRef();

  addNotification = (event: any) => {
    event.preventDefault();
    const notification = this.notificationSystem.current;
    notification.addNotification({
      message: event.message,
      title:event.title,
      level: event.level,
      autoDismiss: event.autoDismiss,
    });
  };

  render() {
    return (
      <div className="App2">
        <button onClick={this.addNotification.bind(this)}>Add notification</button>
        <NotificationSystem ref={this.notificationSystem} />
      </div>
    </div>
    );
  }
}