跳至主要内容

useEventEmitter

基礎的事件觸發器

Usage

即時編輯器

function Demo() {
  const [state, setState] = useState(0);
  const [event, fire, dispose] = useEventEmitter<number>();

  const event1 = useRef<IDisposable>();
  useEffect(() => {
    event((val) => {
      setState(s => s + val);
    });
    event1.current = event(val => setState(s => s + val + 10));
  }, [event]);

  return (
    <div>
      <div>狀態:{state}</div>
      <button onClick={() => fire(1)}>觸發</button>
      <button onClick={() => dispose()}>釋放全部</button>
      <button onClick={() => event1.current?.dispose()}>釋放單個</button>
    </div>
  );
};

render(<Demo/>)
結果
狀態:0

API

useEventEmitter

Returns

readonly [UseEventEmitterEvent<T, U>, (arg1: T, arg2: U) => void, () => void]: 包含以下元素的元組:

  • 添加監聽器的函數。
  • 觸發函數。
  • 停止函數。

Arguments

ads via Carbon