useState 比开关 onValueChange 落后一步

Question

所以我正在渲染一个必须切换

值的开关

const [useBioAuth, setUseBioAuth] = useState<boolean>(false);

这是我的开关

 <Switch
     onValueChange={toggleSwitch}
     trackColor={{ true: colors.secondary }}
     thumbColor={colors.input.bg.normal}
     style={style.marginT10}
     value={useBioAuth}
  />

这是我的 toggleSwitch 函数

const toggleSwitch = useCallback(() => {
    setUseBioAuth(!useBioAuth);
    console.log('toggle '+ useBioAuth)
    _storeData();
  }, [_storeData, useBioAuth]);

  const _storeData = useCallback(async () => {
    try {
      await AsyncStorage.setItem('useBioAuth', JSON.stringify(useBioAuth));
      if (!useBioAuth) {
        await AsyncStorage.removeItem('useBioAuth');
      }
    } catch (error) {
      //TODO
    }
  }, [useBioAuth]);

然而，状态总是比切换落后一步，控制台日志在应该为 false 时显示为 true，反之亦然

有什么想法吗？谢谢

Answer 1

您可以使用函数代替 setState 中的值。所以试试这个：

useState 比开关 onValueChange 落后一步

useState is one step behind on switch onValueChange

react-native

react-hooks

use-state