reactjs - 如何在 react-admin 中的按钮单击回调中调用反应钩子,或者该怎么做?
问题描述
useGetOne
React-admin 提供了类似于和的钩子,useCreate
用于使用 rest 调用读取和写入数据。
从不同来源收集一些数据后,我需要在按钮回调函数中创建新记录。不幸的是,不允许从回调中调用反应钩子。那么我能做些什么呢?
我的问题是我仍然不明白 REACT 和 final-form 是如何工作的。我来自 ASP.NET 角落,所以我熟悉控件的概念,这显然是非常不同的。
下面的代码在运行时抛出以下错误:
错误:无效的挂钩调用。钩子只能在函数组件的主体内部调用。这可能是由于以下原因之一:
1. 你可能有不匹配的 React 版本和渲染器(例如 React DOM)
2. 你可能违反了 Hooks 规则
3. 你可能有多个 React 副本同一个应用程序请参阅/链接已删除/有关如何调试和解决此问题的提示。
错误发生在GetMeasurementTemplate()
其中使用另一个挂钩getOne()
来获取记录。
const createMeasurementJob = ( record ) => {
var counter = 0;
if (record.freimessen.messungen.length > 0) {
record.freimessen.messungen.forEach(element => {
counter++;
var job = {};
job.internalOrderNumber = "TEST" + record.id + "-" + counter;
const measurement = GetMeasurementTemplate(element.ort);
job.locationId = measurement.location;
job.substanceIds = measurement.substances;
job.comment = element.kommentar;
job.assigneeId = element.gaspruefer;
job.date = record.arbeit.ab;
// #### error: invalid hook call ####
const [create, { loading, error }] = useCreate('jobs', job); //* BANG! *//
if (error) { return false }
})
}
return true;
};
const GetMeasurementTemplate = (id) => {
// #### error: invalid hook call ####
const { data, loading, error } = useGetOne('LocationSubstanceMapping', id);
if (loading) { return <LinearProgress />; }
if (error) { return <p>ERROR</p>; }
return data;
};
const CSEButton = ({ handleSubmitWithRedirect, ...props }) => {
const form = useForm();
var formdata = form.getState().values;
const handleClick = useCallback(() => {
createMeasurementJob(formdata)
}, [form]);
return <SaveButton {...props} handleSubmitWithRedirect={handleClick} />;
};