React Native：状态在 useCallBack 钩子函数中变得未定义答案

【问题标题】：React Native : state is getting undefined inside useCallBack hook functionReact Native：状态在 useCallBack 钩子函数中变得未定义
【发布时间】：2020-02-16 14:35:33
【问题描述】：

状态在 useCallBack 钩子中变得未定义我认为它没有获得状态变量的范围

const [selectedLocation, setSelectedLocation] = useState()
const selectLocationHandler = (event) => {
    setSelectedLocation({
        lat: event.nativeEvent.coordinate.latitude,
        lng: event.nativeEvent.coordinate.longitude
    })
    console.log('set location', selectedLocation)
}

const saveLocationPickerHandler = useCallback(() => {
    console.log('saveLocation', selectedLocation)
    if (!selectedLocation) {
        return;
    }
    props.navigation.navigate('DeliveryLocation', { pickedLocation: selectedLocation })
}, [])

设置位置我正在获取对象 { “纬度”：37.775030512686214， “液化天然气”：-122.4273883345241， }

控制台中未定义保存位置

【问题讨论】：

标签： javascript react-native react-navigation react-hooks

【解决方案1】：

您需要提供selectedLocation 作为依赖项。否则，如果状态发生变化，回调将不会更新。

const saveLocationPickerHandler = useCallback(() => {
    console.log('saveLocation', selectedLocation)
    if (!selectedLocation) {
        return;
    }
    props.navigation.navigate('DeliveryLocation', { pickedLocation: selectedLocation })
}, [selectedLocation])

如果您提供一个空数组作为依赖项，则 useCallback 函数将始终具有初始状态并且永远不会更新（selectedLocation）。这与 useEffect 的行为相同

【讨论】：