Home / Class/ Component Class — react Architecture

Component Class — react Architecture

Architecture documentation for the Component class in ReactIncrementalReflection-test.js from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  1d7e7052_afee_2667_9561_3ff0d247fa72["Component"]
  a1730188_225e_762f_b7f7_5de24d9ed4bb["ReactIncrementalReflection-test.js"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|defined in| a1730188_225e_762f_b7f7_5de24d9ed4bb
  5eb222f1_d15f_20d7_d041_4653451c6144["UNSAFE_componentWillMount()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| 5eb222f1_d15f_20d7_d041_4653451c6144
  36296ab2_570b_8e10_5d20_2906ad5017f1["componentDidMount()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| 36296ab2_570b_8e10_5d20_2906ad5017f1
  6ead880d_ef8f_b3b0_1485_9ac367c5d61a["UNSAFE_componentWillUpdate()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| 6ead880d_ef8f_b3b0_1485_9ac367c5d61a
  33444aec_4dd4_2339_3cf4_63c4c90d2617["componentDidUpdate()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| 33444aec_4dd4_2339_3cf4_63c4c90d2617
  4d010025_0f95_e4d7_4685_fb37ba29873a["componentWillUnmount()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| 4d010025_0f95_e4d7_4685_fb37ba29873a
  db6ceae6_90de_51cd_c3a6_5848a9e8b565["render()"]
  1d7e7052_afee_2667_9561_3ff0d247fa72 -->|method| db6ceae6_90de_51cd_c3a6_5848a9e8b565

Relationship Graph

Source Code

packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js lines 59–86

    class Component extends React.Component {
      UNSAFE_componentWillMount() {
        classInstance = this;
        Scheduler.log(['componentWillMount', findInstance(this)]);
      }
      componentDidMount() {
        Scheduler.log(['componentDidMount', findInstance(this)]);
      }
      UNSAFE_componentWillUpdate() {
        Scheduler.log(['componentWillUpdate', findInstance(this)]);
      }
      componentDidUpdate() {
        Scheduler.log(['componentDidUpdate', findInstance(this)]);
      }
      componentWillUnmount() {
        Scheduler.log(['componentWillUnmount', findInstance(this)]);
      }
      render() {
        Scheduler.log('render');
        return this.props.step < 2 ? (
          <span ref={ref => (this.span = ref)} />
        ) : this.props.step === 2 ? (
          <div ref={ref => (this.div = ref)} />
        ) : this.props.step === 3 ? null : this.props.step === 4 ? (
          <div ref={ref => (this.span = ref)} />
        ) : null;
      }
    }

Frequently Asked Questions

What is the Component class?
Component is a class in the react codebase, defined in packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js.
Where is Component defined?
Component is defined in packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js at line 59.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free