英文:
How to update the previous Screen's useState value and refresh the screen on click of goBack()
问题
我想要更新之前屏幕的useState值,并在单击goBack()时刷新屏幕,我知道可以使用useIsFocused()来实现,但在使用这个屏幕时,每次返回到屏幕时都会刷新,假设有一个ScreenA和ScreenB,所以当用户在ScreenB中执行任何操作时,我使用redux分发一个值,并在返回时更新useState值并刷新ScreenA,但它不起作用,我不知道问题在哪里,请帮助。
ScreenB
const leaveGroup = () => {
hideMenu();
callLikeMindsApi(`URL`, httpMethods.HTTP_PUT)
.then(response => {
if (response && response.data && response.data.success) {
hideMenu();
dispatch(updateHomeScreen(true));
props.navigation.goBack();
}
})
.catch(error => {
Alert.alert('FAILED', error.response.data.error_message);
});
};
而在ScreenA中
const { updateValue } = useSelector(state => state.homeReducer);
useEffect(() => {
console.log('updateValue-1234', updateValue);
}); // 如果(updateValue) { setOffset(1); setTotalPages(1); setMyChatRooms([]); getUserData(); } }, [isFocused]);
但是
setOffset(1);
setTotalPages(1);
setMyChatRooms([]);
值没有更新,如果我移除if(updateValue){}并像这样编写
useEffect(() => {
setOffset(1);
setTotalPages(1);
setMyChatRooms([]);
getUserData();
}, [isFocused]);
那么代码会按预期工作,但每次我返回到ScreenA时都会刷新,我希望有条件地刷新。
英文:
I want to update the previous screen's useState value and refresh the screen on click of goBack(), I know there is a useIsFocused() to do that but using this screen it is refreshing every time i goBack to the screen, suppose there is a ScreenA and ScreenB, So when user is performing any action in ScreeB then I am dispatching a value using redux and on goBack I am updating the useState value and refreshing the screenA, But it not working, I don't know what's the problem, Please help.
ScreenB
const leaveGroup = () => {
hideMenu();
callLikeMindsApi(`URL`, httpMethods.HTTP_PUT)
.then(response => {
if (response && response.data && response.data.success) {
hideMenu();
dispatch(updateHomeScreen(true));
props.navigation.goBack();
}
})
.catch(error => {
Alert.alert('FAILED', error.response.data.error_message);
});
};
And In ScreenA
const {updateValue} = useSelector(state => state.homeReducer);
useEffect(() => {
console.log('updateValue-1234', updateValue);
}); // it is printing true in console if (updateValue) { setOffset(1); setTotalPages(1); setMyChatRooms([]); getUserData(); } }, [isFocused]);
But
setOffset(1);
setTotalPages(1);
setMyChatRooms([]);
values are not updating, if I remove the if(updateValue){} and writing like this
useEffect(() => {
setOffset(1);
setTotalPages(1);
setMyChatRooms([]);
getUserData();
}, [isFocused]);
then code is working as expected, But it is refreshing every time I come back to the screenA and I want to refresh conditionally.
答案1
得分: 0
用以下方式替代 props.navigation.goBack();
props.navigation.navigate('ScreenA', {details});
带着你想传递的属性,在屏幕A中,从路由参数中获取该值:
ScreenA = (props) => {
const [navigateState] = useState(props.route.params.details || {});
}
在导航到屏幕B时:
props.navigation.navigate('ScreenB', {details: navigateState});
英文:
instead of props.navigation.goBack(); do
props.navigation.navigate('ScreenA',{details});
with the prop that you want pass
in screen A get that value in state from route params
ScreenA = (props) => {
const [navigateState] = useState(props.route.params.details||{});
---while navigating to Screen B---
props.navigation.navigate('ScreenB',{details: navigateState});
...
答案2
得分: 0
我无法获取完整的代码并理解完整的逻辑,但如果您已经实现了redux,应该像这样使用它:
const {updateValue} = useSelector(state => state.homeReducer);
useEffect(() => {
if (updateValue) {
// 通过设置当前组件的一些状态来更新您的屏幕。
} else {
// 不要更新
}
}, [updateValue])
如果您在应用程序的任何地方分发了updateValue
的真值,那么无论屏幕-A是否获取焦点,它都将被更新。如果您只希望在屏幕-A处于焦点时更新它,您应该在useEffect
中添加焦点条件。
英文:
I can't get full your code and understand the full logic but if you have already implemented redux you should use it like this:
const {updateValue} = useSelector(state => state.homeReducer);
useEffect(()=>{
if (updateValue) {
// update your screen juse by setting some states on the current component.
} else {
// don't update
}
}, [updateValue])
if you dispatch true value for updateValue whereever in your app then screen-A would be updated regardless it's getting focus or not. if you want to update screen-A only when it's on focus you should add focus condition in useEffect.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论