React snippets

import * as React from "react";

import * as React from "react";
import { Component } from "react";

import ReactDOM from "react-dom";

import * as React from "react";
import { useState } from "react";

import * as React from "react";
import { useState, useEffect } from "react";

import PropTypes from "prop-types";

import * as React from "react";
import { PureComponent } from "react";

class | extends React.Component {
  render() {
    return <div>|</div>
  }
}

export default |;

class | extends Component {
  constructor(props) {
    super(props);
    this.state = { | };
  }
  render() {
    return ( | );
  }
}

export default |;

class | extends PureComponent {
  state = { | },
  render() {
    return ( | );
  }
}

export default |;

function (|) {
    return ( | );
}

export default |;

const | = props => {
  return ( | );
};

export default |;

componentDidMount() {
  |
}

useEffect(() => {
  |
}, []);

//WARNING! To be deprecated in React v17. Use componentDidMount instead.
componentWillMount() {
  |
}

//WARNING! To be deprecated in React v17. Use new lifecycle static getDerivedStateFromProps instead.
componentWillReceiveProps(nextProps) {
  |
}

static getDerivedStateFromProps(nextProps, prevState) {
  |
}

shouldComponentUpdate(nextProps, nextState) {
  |
}

//WARNING! To be deprecated in React v17. Use componentDidUpdate instead.
componentWillUpdate(nextProps, nextState) {
  |
}

componentDidUpdate(prevProps, prevState) {
  |
}

componentWillUnmount() {
  |
}

componentDidCatch(error, info) {
  |
}

getSnapshotBeforeUpdate(prevProps, prevState) {
  |
}

this.setState({ | : | });

this.setState(prevState => {
  return { | : prevState.| }
});

const [|, set|] = useState();

render() {
  return (
    |
  );
}

class | extends Component {
  state = { | },
  render() {
    return this.props.render({
      |: this.state.|
    });
  }
}

export default |;

function | (|) {
  return class extends Component {
    constructor(props) {
      super(props);
    }

    render() {
      return < | {...this.props} />;
    }
  };
}

  | = (e) => {
    |
  }