我有一個不可見的全屏事件處理組件，可以捕獲和處理所有滑鼠事件。在某些事件中，我想呼叫子組件中的特定函式。我在父組件中創建了一個狀態變數。如果父組件中的狀態變數有一些更改，我會在子組件中使用使用效果進行監聽。然而，效果掛鉤經常被呼叫。有沒有更好的方法來做到這一點？特別是我想在滑鼠按下時設定drawing=true，在滑鼠抬起時設定drawing=false。如果繪圖從真轉換為假，我想在資料庫中保存一些東西。因此， useState 中的函式只被呼叫一次很重要。
uj5u.com熱心網友回復：
我有這兩種可能的解決方案。
- 如果您不希望在第一次渲染中呼叫 useEffect，則必須使用自定義鉤子，可能稱為
useUpdateEffect. 這是 react-use 包的使用指南
- 用于
useImperativeHandle從父級在子級中運行函式。例子：
import React, { forwardRef, useRef } from 'react';
export default function Parent() {
const ref = useRef<Ref>(null!);
const handleCallFunction = (): void => ref?.current?.functionInChild();
return (
<div>
<button onClick={handleCallFunction}>
call a function in child from parent
</button>
<Child ref={ref} />
</div>
);
}
type Ref = {
functionInChild: () => void;
};
type Props = {};
const Child = forwardRef<Ref, Props>((props, ref) => {
const functionInChild = () => {
console.log('called from parent');
};
React.useImperativeHandle(ref, () => ({ functionInChild }));
return <div>Child!</div>;
});
uj5u.com熱心網友回復：
你必須把它放在你的代碼中
useEffect(()=>{
/*Query logic*/
console.log('i fire once');},[your_variable]);
you_variable當這個變數改變他的值時你想改變它
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/357426.html
標籤：javascript 反应 反应钩子