哪个参数触发了 React.useMemo 重新计算?
Which param triggered React.useMemo recalculation?
这是我的 React 钩子代码:
function calc_c({a,b}){
//some long calculation that is based on a,b
}
function MyComponent(params){
var a=calc_a(params)
var a=calc_b(params)
var c=React.useMemo(()=>calc_c({a,b},[a,b])
}
我的问题:如何找出 [a,b]
中的哪些参数更改并导致调用 calc_c
编辑:我最终使用了通用版本的 skyboyer 出色的答案:
export function useChanged(name,value){
function print_it(){
console.log('changed',name)
}
React.useMemo(print_it,[value])
}
这取决于您是出于调试目的还是希望在代码中依赖它(例如,“如果 A 发生变化,则 return B,否则 C”)
对于这两种情况,都没有简单的实现方法。但解决方法会有所不同。
假设您只想弄清楚为什么要重新计算。然后只需放入 bazillion
useEffect(() => {
console.log("a is changed");
}, [a])
每个依赖项一个。是的,无聊和重复。但最简单的方法是,你实际上应该越少担心另外。或者看看 useWhatChaged
是否对你有用(如果依赖列表中确实有十几个变量)。
另一件事,如果你想在你的常规(我的意思是不是为了调试目的的临时代码)中进行检查(但为什么?)。那么你可能会使用 usePrevious
或写类似的东西。
这是我的 React 钩子代码:
function calc_c({a,b}){
//some long calculation that is based on a,b
}
function MyComponent(params){
var a=calc_a(params)
var a=calc_b(params)
var c=React.useMemo(()=>calc_c({a,b},[a,b])
}
我的问题:如何找出 [a,b]
中的哪些参数更改并导致调用 calc_c
编辑:我最终使用了通用版本的 skyboyer 出色的答案:
export function useChanged(name,value){
function print_it(){
console.log('changed',name)
}
React.useMemo(print_it,[value])
}
这取决于您是出于调试目的还是希望在代码中依赖它(例如,“如果 A 发生变化,则 return B,否则 C”)
对于这两种情况,都没有简单的实现方法。但解决方法会有所不同。
假设您只想弄清楚为什么要重新计算。然后只需放入 bazillion
useEffect(() => {
console.log("a is changed");
}, [a])
每个依赖项一个。是的,无聊和重复。但最简单的方法是,你实际上应该越少担心另外。或者看看 useWhatChaged
是否对你有用(如果依赖列表中确实有十几个变量)。
另一件事,如果你想在你的常规(我的意思是不是为了调试目的的临时代码)中进行检查(但为什么?)。那么你可能会使用 usePrevious
或写类似的东西。