当我从页面来回移动时，它不会发送发布请求

Question

我有一个组件，其中列出了策略。例如，当我来到"a"的支付界面时;政策，我发送了一个帖子请求。我可以查看保单的分期付款。然后在浏览器中按后退键返回，进入保单支付界面。我看到了"a"的分期付款。Policy显示在屏幕上。如果我们刷新页面，它会发送一个post请求，我就可以查看保单的分期付款了。如何在不刷新页面的情况下发送post请求?

const getAsosPaymentInfo = (getPolicyAccountInfoRequestDto) => {
return new Observable((observer) => { 
axiosInstance
.post(SERVICE_PATH + '/getAsosPaymentInfo', getPolicyAccountInfoRequestDto)
.then((response) => {
observer.next(response.data);
observer.complete();
})
.catch((err) => {
console.log(err);
});
});
};

<<p>组件/strong>

const { paymentInfoData, setPaymentInfoData } = useContext(PaymentInfoDataContext);
useEffect(() => {
if (Object.keys(paymentInfoData).length === 0 && props.location.state.policy.isActive === true) {
PolicyService.getAsosInstallments(
{
policyNumber: props.location.state.policy.policyNumber,
renewalNumber: props.location.state.policy.renewalNumber,
policyTypeExtCode: props.location.state.policy.policyType.extCode,
productTypeExtCode: props.location.state.policy.productType.extCode
}
).subscribe(
(response) => {
setPaymentInfoData(response);
}
);
}
}, []);

Answer 1

为了性能优化，React Navigation避免每次用户重新访问屏幕时都挂载屏幕。您需要监听屏幕焦点事件，然后在那里运行您的逻辑。

React Navigation提供了一个与普通useEffect一起工作的钩子

import {useIsFocused, useNavigation} from '@react-navigation/native';
// Some where inside screen
const { paymentInfoData, setPaymentInfoData } = useContext(PaymentInfoDataContext);
const isFocused = useIsFocused()
useEffect(() => {
if (Object.keys(paymentInfoData).length === 0 && props.location.state.policy.isActive === true) {
PolicyService.getAsosInstallments(
{
policyNumber: props.location.state.policy.policyNumber,
renewalNumber: props.location.state.policy.renewalNumber,
policyTypeExtCode: props.location.state.policy.policyType.extCode,
productTypeExtCode: props.location.state.policy.productType.extCode
}
).subscribe(
(response) => {
setPaymentInfoData(response);
}
);
}
}, [isFocused]);