如何使用useFocusEffect钩子获取数据？

Question

我是个新手，刚升级到react-navigation-5

我正在努力用新的钩子useFocusEffect替换旧的useFocusEffect函数

下面是旧的功能：

const loadTrips = useCallback(async() => {
        setError(null);
        setIsRefreshing(true);
        try {
            dispatch(tripActions.fetchTrip());
        } catch (error) {
            console.log(error);
            setError(error.message);
        }
        setIsRefreshing(false);
    },[dispatch, setIsRefreshing, setError]);
*********************************************************
// This is the old function
    useEffect(() => {
        const willFocus = props.navigation.addListener(
            'willFocus',
            loadTrips
        );
        return () => {willFocus.remove();}
    },[loadTrips]);
*********************************************************

    useEffect(() => {
        setIsLoading(true);
        loadTrips().then(
            setIsLoading(false),
        );
    }, [dispatch, loadTrips])

编辑1

我试图将loadtrips函数传递给useFocusEffect，但它显示了错误

useFocusEffect(loadTrips) 

请帮助

​

​

Answer 1

您可以简单地将loadTrips函数传递给useFocusEffect

const loadTrips = useCallback(async() => {
        setError(null);
        setIsRefreshing(true);
        try {
            dispatch(tripActions.fetchTrip());
        } catch (error) {
            console.log(error);
            setError(error.message);
        }
        setIsRefreshing(false);
    },[dispatch, setIsRefreshing, setError]);
useFocusEffect(useCallback(() => loadTrips(), [dispatch, setIsRefreshing, setError]));