ReactTextElement.tsx

import React from 'react';

interface TextBoxState {
  text: string;
}

class TextBox extends React.Component<{}, TextBoxState> {
  constructor(props: {}) {
    super(props);
    this.state = {
      text: '',
    };
  }

  componentDidMount() {
    const savedText = localStorage.getItem('savedText');
    if (savedText) {
      this.setState({ text: savedText });
    }
  }

  componentDidUpdate(_: {}, prevState: TextBoxState) {
    if (prevState.text !== this.state.text) {
      localStorage.setItem('savedText', this.state.text);
    }
  }

  handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
    this.setState({ text: event.target.value });
  };

  render() {
    return (
      <textarea value={this.state.text} onChange={this.handleChange} />
    );
  }
}

export default TextBox;