在回调中响应自定义挂钩
在回调中响应自定义挂钩
提问于 2019-11-12 15:22:07
我试图在回调逻辑中使用我的自定义钩子，如下所示：
import React, { useEffect, useState } from 'react';
import useDataChange from '../../hooks/useDataChange';
const SomeComponent = () => {
return (
<Table
handleTableChange={data => useDataChange(data)}
/>
);
};
export default SomeComponent;我的定制钩子(只是为了简化)看起来是这样的：
const useDataChange = data => {
console.log(data);
};
export default useDataChange;简而言之，自定义钩子应该是在表中的数据被更改时触发的(即。当触发表组件中的handleTableChange时)。相反，我得到了：
React "useDataChange“不能在回调中调用。必须在React函数组件或自定义React函数React /rules of Hooks中调用react。
当表数据被更改时，如何使用它？
Stack Overflow用户
发布于 2019-11-12 16:22:06
就像上面说的React Hooks must be called in a React function component or a custom React Hook function react-hooks/rules-of-hooks。React有这个局限性，因此它可以跟踪状态和效果。在您的情况下，您可以定义自定义钩子来返回一个完成所需工作的函数，而不是直接在钩子中执行它。
在这种情况下，您的自定义钩子文件将类似于-
const useDataChange = () => data => {
console.log(data);
};
export default useDataChange;然后在你的组件中你可以这样使用它-
import React, { useEffect, useState } from 'react';
import useDataChange from '../../hooks/useDataChange';
const SomeComponent = () => {
const callback = useDataChnage();
return (
<Table handleTableChange={callbackdata} />
);
};
export default SomeComponent;页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58821668
复制相关文章
相似问题
腾讯云开发者
