You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在不使用第三方库的情况下打开React Native表情键盘?

React Native 无需第三方库唤起表情键盘的实现方法

React Native 原生的 TextInput 组件本身就支持唤起系统表情键盘,完全不用依赖第三方库,只需根据 iOS 和 Android 平台的差异调整对应属性即可:

  • iOS 端:直接将 keyboardType 设为 'emoji',就能直接唤起系统原生的表情键盘
  • Android 端:设置 inputType='textShortMessage',配合默认的 keyboardType='default',系统键盘会自动显示表情切换按钮(部分厂商ROM可能需要用户手动切换,但这是原生系统的默认行为)

调整后的完整代码:

import { TextInput, Platform } from 'react-native';

<TextInput 
  onChangeText={e => handleChange("message", e)} 
  keyboardType={Platform.OS === 'ios' ? 'emoji' : 'default'}
  inputType={Platform.OS === 'android' ? 'textShortMessage' : undefined}
/>

补充说明:如果需要页面加载时自动弹出表情键盘,可以给 TextInput 加上 autoFocus={true} 属性,具体根据业务需求调整。Android 上的表情切换逻辑由系统控制,不同品牌手机可能表现略有差异,但都是原生支持的功能。

内容的提问来源于stack exchange,提问作者Hamza Ilyas

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.06 09:10:34