如何在React Native中实现程序化点击/触摸操作？

最优方案：直接触发弹窗关闭逻辑 #

没必要绕路模拟全局点击，既然你通过控制弹窗的显示状态来管理它，直接修改状态就能关闭，这是最可靠的方法。

示例代码：

import { useState, Modal, View, Text, useEffect } from 'react-native';

function App() {
  const [modalVisible, setModalVisible] = useState(true);

  // 程序化关闭弹窗的核心函数
  const closeModal = () => {
    setModalVisible(false);
  };

  // 示例：组件挂载后2秒自动关闭弹窗
  useEffect(() => {
    const autoCloseTimer = setTimeout(closeModal, 2000);
    return () => clearTimeout(autoCloseTimer);
  }, []);

  return (
    <View style={{ flex: 1 }}>
      <Modal
        visible={modalVisible}
        transparent={true}
        onRequestClose={closeModal}
      >
        {/* 弹窗遮罩层，原本点击这里关闭弹窗 */}
        <View 
          style={{ 
            flex: 1, 
            justifyContent: 'center', 
            alignItems: 'center', 
            backgroundColor: 'rgba(0,0,0,0.5)' 
          }}
          onPress={closeModal} // 原有人工点击关闭逻辑
        >
          <View style={{ backgroundColor: 'white', padding: 20, borderRadius: 8 }}>
            <Text>弹窗内容</Text>
          </View>
        </View>
      </Modal>
    </View>
  );
}

若必须模拟全局点击（如第三方弹窗组件） #

如果弹窗是第三方组件，无法直接修改显示状态，可以通过给全屏可交互组件加ref，程序化触发点击事件：

方法：使用Pressable的press()方法（React Native 0.63+支持）

import { useState, Modal, View, Text, Pressable, useRef, useEffect } from 'react-native';

function App() {
  const [modalVisible, setModalVisible] = useState(true);
  const globalPressRef = useRef(null);

  // 模拟全局点击的函数
  const simulateGlobalTap = () => {
    globalPressRef.current?.press();
  };

  // 示例：延迟触发模拟点击
  useEffect(() => {
    const timer = setTimeout(simulateGlobalTap, 2000);
    return () => clearTimeout(timer);
  }, []);

  return (
    <View style={{ flex: 1 }}>
      {/* 全屏透明可交互层，用来模拟全局点击 */}
      <Pressable
        ref={globalPressRef}
        style={{ 
          position: 'absolute', 
          top: 0, 
          left: 0, 
          right: 0, 
          bottom: 0,
          zIndex: 999 // 确保层级在弹窗下方，不遮挡弹窗内容
        }}
        onPress={() => setModalVisible(false)}
        disabled={!modalVisible} // 弹窗关闭时禁用，避免干扰正常交互
      />

      <Modal
        visible={modalVisible}
        transparent={true}
        onRequestClose={() => setModalVisible(false)}
      >
        <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: 'rgba(0,0,0,0.5)' }}>
          <View style={{ backgroundColor: 'white', padding: 20, borderRadius: 8 }}>
            <Text>弹窗内容</Text>
          </View>
        </View>
      </Modal>
    </View>
  );
}

旧版本兼容方案：使用UIManager（不推荐）

如果你的React Native版本低于0.63，可以用UIManager触发触摸事件，但跨平台兼容性较差：

import { UIManager, findNodeHandle, TouchableOpacity, useRef } from 'react-native';

const touchRef = useRef(null);

const simulateGlobalTap = () => {
  const node = findNodeHandle(touchRef.current);
  if (node) {
    UIManager.dispatchViewManagerCommand(
      node,
      UIManager.getViewManagerConfig('TouchableOpacity').Commands.press,
      []
    );
  }
};

内容的提问来源于stack exchange，提问作者prabal taskmanager2