如何基于状态变量正确运行useEffect钩子以实现相机权限重复唤起？

问题根因 #

1. 代码笔误：原有代码中Camera.requestPermissionsAsync()的返回值仅解构赋值给了status变量，后续判断时误用了未定义的cameraPermissions变量，会直接导致逻辑异常。
2. 系统限制：iOS、安卓系统都有默认机制，用户主动拒绝权限后，若勾选了「不再询问」（iOS拒绝后默认永久不可再次弹出申请），直接调用requestPermissionsAsync不会再弹出系统弹窗，只会直接返回拒绝状态，避免应用反复骚扰用户。
3. 依赖项逻辑错误：你尝试的写法中依赖项为[hasPermission === null]，首次执行后hasPermission会被赋值为布尔值，永远不再为null，所以useEffect不会再次触发。

可行解决方案 #

核心思路是每次进入相机页面时先查询当前权限状态，再根据状态决定后续操作，如果是用路由框架（比如React Navigation）可以用页面聚焦钩子触发校验，没有路由框架的话可以手动维护触发变量。

示例代码（基于React Navigation）

import { useFocusEffect } from '@react-navigation/native';
import { Alert, Linking, Platform } from 'react-native';

// 原有状态保留
const [hasPermission, setHasPermission] = useState(null);

// 每次页面聚焦时触发权限校验
useFocusEffect(
  useCallback(async () => {
    // 第一步：先查询当前权限状态，不要直接申请
    const cameraPerm = await Camera.getPermissionsAsync();
    const audioPerm = await Audio.getPermissionsAsync();

    // 两个权限都已授予，直接正常使用
    if (cameraPerm.status === 'granted' && audioPerm.status === 'granted') {
      setHasPermission(true);
      return;
    }

    // 第二步：判断是否还能弹出系统申请窗
    const canRequestCamera = cameraPerm.status !== 'granted' && cameraPerm.canAskAgain;
    const canRequestAudio = audioPerm.status !== 'granted' && audioPerm.canAskAgain;

    if (canRequestCamera || canRequestAudio) {
      // 还能申请，弹出系统权限窗
      const newCameraPerm = await Camera.requestPermissionsAsync();
      const newAudioPerm = await Audio.requestPermissionsAsync();
      setHasPermission(newCameraPerm.status === 'granted' && newAudioPerm.status === 'granted');
    } else {
      // 已被永久拒绝，弹出自定义提示引导用户去系统设置开启
      Alert.alert(
        '权限不足',
        '使用相机功能需要授予相机和麦克风权限，请前往系统设置手动开启',
        [
          { text: '取消', style: 'cancel' },
          { 
            text: '去设置', 
            onPress: () => {
              // 跳转到应用系统设置页
              const settingUrl = Platform.OS === 'ios' 
                ? 'app-settings:' 
                : 'package:替换为你的应用包名';
              Linking.openURL(settingUrl);
            }
          }
        ]
      );
      setHasPermission(false);
    }
  }, [])
);

无路由框架的写法

如果没有用React Navigation，可以手动维护一个触发变量，每次进入相机页面时更新变量触发校验：

const [permCheckTrigger, setPermCheckTrigger] = useState(0);

// 进入相机页面时调用，比如点击相机入口的回调里加这行
// setPermCheckTrigger(prev => prev + 1)

useEffect(() => {
  // 这里放上面useFocusEffect里的相同逻辑
}, [permCheckTrigger]);

内容的提问来源于stack exchange，提问作者newbie coder