Detect if an SharePoint Framework (SPFx) web part is in display mode or not, using TypeScript.

sample-web-part.tsx

import { DisplayMode } from '@microsoft/sp-core-library';
import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';
import * as React from 'react';
import * as ReactDom from 'react-dom';

export default class SampleWebPart extends BaseClientSideWebPart<{}> {
  public render() {
    ReactDom.render(
      <div>
        {this.displayMode === DisplayMode.Edit ? <span>Edit mode</span> : null}

        {this.displayMode === DisplayMode.Read ? <span>Read mode</span> : null}
      </div>,
      this.domElement
    );
  }
}