如何通过事件或按钮触发文本选中，解决滚动误触选中文本问题

问题分析 #

你遇到的核心问题是默认selectable={true}的Text组件触发逻辑过于灵敏，在滚动页面、切换文本块时容易误触发选中文本菜单，影响正常操作。而通过长按动态修改selectable属性的方案无效，因为组件重新渲染后无法即时唤起选中UI，必须二次交互才能调出操作菜单。

可行解决方案 #

方案1：使用第三方库实现长按触发文本选中 #

推荐使用react-native-selectable-text库，它支持仅通过长按触发文本选中，还能自定义长按延迟时长，从根源避免滚动误触的问题。

示例代码：

import SelectableText from 'react-native-selectable-text';

// 组件内使用
<SelectableText
  selectable={true}
  selectionColor="#a8e6cf"
  minSelectionDuration={500} // 设置长按延迟，避免误触
>
  需要选中的文本内容
</SelectableText>

该库默认以长按作为文本选中的触发条件，不会在滚动操作时误唤起选中菜单，完全适配你的需求。

方案2：原生手势结合手动触发文本选中（无第三方库） #

如果不想依赖第三方库，可以借助react-native-gesture-handler的LongPressGestureHandler包裹Text组件，默认关闭selectable，长按触发后通过原生模块直接唤起文本选中菜单：

1. 先完成react-native-gesture-handler的安装与基础配置
2. 实现代码：

import { Text, NativeModules, findNodeHandle } from 'react-native';
import { LongPressGestureHandler, State } from 'react-native-gesture-handler';
import { useRef } from 'react';

const { UIManager } = NativeModules;

// 组件内部
const textRef = useRef(null);

const handleLongPress = (event) => {
  if (event.nativeEvent.state === State.ACTIVE) {
    // 开启文本可选中状态
    textRef.current.setNativeProps({ selectable: true });
    // 调用原生命令直接唤起全选菜单
    UIManager.dispatchViewManagerCommand(
      findNodeHandle(textRef.current),
      UIManager.getViewManagerConfig('RCTText').Commands.selectAll,
      []
    );
  }
};

return (
  <LongPressGestureHandler
    onHandlerStateChange={handleLongPress}
    minDurationMs={500} // 设置长按延迟，过滤误触操作
  >
    <Text ref={textRef} selectable={false}>
      需要选中的文本内容
    </Text>
  </LongPressGestureHandler>
);

这个方案通过设置长按延迟（如500ms）确保只有刻意的长按操作才会触发文本选中，滚动时不会误触。同时通过原生命令直接唤起选中菜单，无需用户二次点击。

注意：selectAll命令在部分React Native版本或平台上可能存在兼容性问题，若无效可尝试其他原生文本操作命令。

内容的提问来源于stack exchange，提问作者Joe Lu