我正在跟踪具有date
变量的组件。在每次重新渲染时,date
变量都会更新。现在的问题是,因为我已将日期分配给查询变量,graphql一次又一次地无限次获取。我调试了代码,发现apollo是Observing on date
variable,当它接收到一个新值时,它将重新显示。
import React from 'react';
import { getISODate } from '../../dateUtils';
import { useQuery } from '@apollo/react-hooks';
import { GET_EXPENSE_STATUS } from '../../queries';
import get from 'lodash/get';
const ExpenseStatus = (props) => {
const date = getISODate(); // returns current date as ISO String Format
const { loading, error, data } = useQuery(GET_EXPENSE_STATUS, {
variables: {
date
}
});
if (error) return <p>Error :(</p>;
return(
<div>
{get(data, 'expenseStatus.value')}
</div>
);
};
我也尝试过useLazyQuery
。但是没有运气。
const date = getISODate(); // returns current date in ISO String
const [loadExpenseStatus, { loading, error, data }] = useLazyQuery(GET_EXPENSE_STATUS, {
variables: {
date
}
});
useEffect(() => {
if(!called) {
loadExpenseStatus();
}
}, []);
因此,有什么办法可以跳过此观察者吗?我只想收到一次提取呼叫。
可能有两种解决方案,第一种(初始值“冻结”):
const [staticDate] = useState( getISODate() );
const { loading, error, data } = useQuery(GET_EXPENSE_STATUS, {
variables: {
date: staticDate
}
});
或简单const [date] = useState( getISODate() );
,variables: { date }
... ...否date
,其他位置需要当前值。
第二个(当输出/渲染中不需要“日期”值时):
const [loadExpenseStatus, { loading, error, data }] = useLazyQuery(GET_EXPENSE_STATUS);
useEffect(() => {
loadExpenseStatus( {
variables: {
date: getISODate()
}
} );
}, []); // called once
docs:https : //www.apollographql.com/docs/react/data/queries/#executing-queries-manually
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句