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

如何在react-native-phone-number-input中仅保留GB国家码并禁用切换功能

解决react-native-phone-number-input仅保留GB国家码的问题

要实现仅保留英国(GB)国家码、禁止切换其他国家的需求,你可以通过以下两个关键配置达成目标:

  • 限定可选国家范围:使用countries属性,仅传入["GB"],这样组件只会加载并显示英国国家码,不会提供其他国家选项。
  • 禁用国家码区域交互:添加disableFlagPress={true},彻底禁止点击国家码区域触发选择器的行为(可选配置,若已限定countries为单元素数组,其实已无法切换,但加上该属性能进一步避免误操作)。

修改后的代码如下:

<PhoneInput
  ref={phoneInput}
  defaultValue={phoneNumber}
  defaultCode="GB"
  layout="second"
  withShadow
  filterProps
  autoFocus
  disableArrowIcon
  // 仅允许选择英国国家码
  countries={["GB"]}
  // 禁止点击国家码区域触发选择器
  disableFlagPress={true}
  containerStyle={styles.phoneContainer}
  textContainerStyle={styles.textInput}
  onChangeFormattedText={(text) => {
    setphoneNumber(text);
  }}
/>

配置完成后,组件只会固定显示英国国家码,用户无法切换到其他国家,完全适配你面向英国用户的应用场景。

内容的提问来源于stack exchange,提问作者Erin Macfarlane

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.08.20 20:09:30