import React, { useRef, useState } from "react";
import { useOutsideClick } from "@tencent/tea-component";

export default function Demo() {
  const ref1 = useRef(null);
  const ref2 = useRef(null);
  const [count, setCount] = useState(0);
  const { listen } = useOutsideClick([ref1, ref2]);
  listen(() => setCount(count => count + 1));

  return (
    <>
      <div ref={ref1} style={{ background: "#0abf5b" }}>
        点击外部 {count} 次
      </div>
      <div ref={ref2} style={{ background: "#ff9700" }}>
        点击外部 {count} 次
      </div>
    </>
  );
}
