我知道使用回调函数在子节点和父节点之间传递数据,但我的问题是:从父节点启动回调触发器的最佳方法?.如果需要多次检索数据,则在再次打开触发器之前需要关闭触发器,则传递布尔属性以打开触发器似乎不是最佳方法,对吗?有更好的方法吗?
假设将状态向上移动到父级是不可行的,可能是第三方组件或任何其他有效的原因不允许这样做。
//pseudo code showing attempt to initiate the callback invocation from parent, by pasing a prop to trigger the callback
function Parent() {
const postProcessData = (data:any)=>{
console.debug(data)
}
// used to control when the callback will be invoked on the child side
const [trigger, setTrigger] = useState<boolean>(false)
return (<Child onReturnData={postProcessData} invokeCallback={trigger} />)
}
function Child({onReturnData:()=>any, trigger: boolean}) {
//will be called only if trigger changes
useEffect(()=>{
if(trigger)
onReturnData(/*some calculated stuff*/)
},[trigger])
}
1条答案
按热度按时间ldioqlga1#
如果您需要以正确的方式从父组件触发子组件中的某个函数,请检查useImperativeHandle挂钩。
总结一下钩子的作用,你可以把一个ref从父组件传递到子组件,并使用useImperativeHandle给ref添加额外的属性,现在你可以通过访问ref对象在父组件中使用这些属性。