render() — react Function Reference

Architecture documentation for the render() function in ReactCompositeComponentNestedState-test.js from the react codebase.

Function javascript BabelCompiler Validation calls 1 called by 1

Entity Profile

BabelCompiler→ Validation→ render() — react Function Reference

Dependency Diagram

graph TD
  31634268_e2d5_5862_9997_3b8d9ec874a3["render()"]
  1317fb94_2e60_b063_266a_96909a9c0ce0["ChildComponent"]
  31634268_e2d5_5862_9997_3b8d9ec874a3 -->|defined in| 1317fb94_2e60_b063_266a_96909a9c0ce0
  580c9e0b_9862_5d84_d637_c45499386ca9["render()"]
  580c9e0b_9862_5d84_d637_c45499386ca9 -->|calls| 31634268_e2d5_5862_9997_3b8d9ec874a3
  580c9e0b_9862_5d84_d637_c45499386ca9["render()"]
  31634268_e2d5_5862_9997_3b8d9ec874a3 -->|calls| 580c9e0b_9862_5d84_d637_c45499386ca9
  style 31634268_e2d5_5862_9997_3b8d9ec874a3 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-dom/src/__tests__/ReactCompositeComponentNestedState-test.js lines 76–94

      render() {
        this.props.logger('render', this.state.hue, this.props.color);
        return (
          <div>
            <button onClick={this.handleHue.bind(this, 'dark', 'blue')}>
              Dark Blue
            </button>
            <button onClick={this.handleHue.bind(this, 'light', 'blue')}>
              Light Blue
            </button>
            <button onClick={this.handleHue.bind(this, 'dark', 'green')}>
              Dark Green
            </button>
            <button onClick={this.handleHue.bind(this, 'light', 'green')}>
              Light Green
            </button>
          </div>
        );
      }