render() — react Function Reference

Architecture documentation for the render() function in hover.js from the react codebase.

Function javascript BabelCompiler Optimization calls 1

Entity Profile

BabelCompiler→ Optimization→ render() — react Function Reference

Dependency Diagram

graph TD
  f984d8ff_206f_4a6e_4efa_d7cbbd8d932a["render()"]
  6db9f06c_a10d_0ce4_2572_ae98abdac195["Hover"]
  f984d8ff_206f_4a6e_4efa_d7cbbd8d932a -->|defined in| 6db9f06c_a10d_0ce4_2572_ae98abdac195
  71b5c81a_6c35_2de0_6be2_4ff47f948410["render()"]
  f984d8ff_206f_4a6e_4efa_d7cbbd8d932a -->|calls| 71b5c81a_6c35_2de0_6be2_4ff47f948410
  style f984d8ff_206f_4a6e_4efa_d7cbbd8d932a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

fixtures/dom/src/components/fixtures/pointer-events/hover.js lines 19–48

  render() {
    const {overs, outs, enters, leaves} = this.state;

    return (
      <TestCase title="Hover" description="">
        <TestCase.Steps>
          <li>Hover over the above box and the obstacles</li>
        </TestCase.Steps>

        <TestCase.ExpectedResult>
          Overs and outs should increase when moving over the obstacles but
          enters and leaves should not.
        </TestCase.ExpectedResult>

        <HoverBox
          onOver={this.onOver}
          onOut={this.onOut}
          onEnter={this.onEnter}
          onLeave={this.onLeave}
        />

        <p>
          Pointer Overs: <b>{overs}</b> <br />
          Pointer Outs: <b>{outs}</b> <br />
          Pointer Enters: <b>{enters}</b> <br />
          Pointer Leaves: <b>{leaves}</b> <br />
        </p>
      </TestCase>
    );
  }