react Architecture Docs
Home / Function/ Component() — react Function Reference

Component() — react Function Reference

Architecture documentation for the Component() function in valid-setState-in-useEffect-via-useEffectEvent-with-ref.js from the react codebase.

Function javascript TestingUtilities Fixtures calls 2

Entity Profile

Dependency Diagram

graph TD
  19caa17b_f15c_4fff_410a_21a2df082f87["Component()"]
  df9489d2_cea6_6289_eb93_f87c93e43d29["valid-setState-in-useEffect-via-useEffectEvent-with-ref.js"]
  19caa17b_f15c_4fff_410a_21a2df082f87 -->|defined in| df9489d2_cea6_6289_eb93_f87c93e43d29
  a97efee6_72f2_56ac_7dba_21d9434dd79f["load()"]
  19caa17b_f15c_4fff_410a_21a2df082f87 -->|calls| a97efee6_72f2_56ac_7dba_21d9434dd79f
  e55a128b_3391_e5ee_54e0_5b0c17ab0dd5["areEqual()"]
  19caa17b_f15c_4fff_410a_21a2df082f87 -->|calls| e55a128b_3391_e5ee_54e0_5b0c17ab0dd5
  style 19caa17b_f15c_4fff_410a_21a2df082f87 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/valid-setState-in-useEffect-via-useEffectEvent-with-ref.js lines 4–41

function Component({x, y}) {
  const previousXRef = useRef(null);
  const previousYRef = useRef(null);

  const [data, setData] = useState(null);

  const effectEvent = useEffectEvent(() => {
    const data = load({x, y});
    setData(data);
  });

  useEffect(() => {
    const previousX = previousXRef.current;
    previousXRef.current = x;
    const previousY = previousYRef.current;
    previousYRef.current = y;
    if (!areEqual(x, previousX) || !areEqual(y, previousY)) {
      effectEvent();
    }
  }, [x, y]);

  const effectEvent2 = useEffectEvent((xx, yy) => {
    const previousX = previousXRef.current;
    previousXRef.current = xx;
    const previousY = previousYRef.current;
    previousYRef.current = yy;
    if (!areEqual(xx, previousX) || !areEqual(yy, previousY)) {
      const data = load({x: xx, y: yy});
      setData(data);
    }
  });

  useEffect(() => {
    effectEvent2(x, y);
  }, [x, y]);

  return data;
}

Domain

Subdomains

Defined In

Calls

Source

Frequently Asked Questions

What does Component() do?
Component() is a function in the react codebase, defined in compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/valid-setState-in-useEffect-via-useEffectEvent-with-ref.js.
Where is Component() defined?
Component() is defined in compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/valid-setState-in-useEffect-via-useEffectEvent-with-ref.js at line 4.
What does Component() call?
Component() calls 2 function(s): areEqual, load.

Analyze Your Own Codebase

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

Try Supermodel Free