时间戳

首页 > 解决方案 > 无法在 iOS 上获取电话号码以自动填充

react-native - 无法在 iOS 上获取电话号码以自动填充

问题描述

该<TextInput>组件有一个textContentType字段允许您自动填充某些字段，即姓名、电子邮件、电话等。我似乎无法让它自动填充电话号码，我错过了什么吗？

<TextInput
    autoFocus
    blurOnSubmit={false}
    editable={!loading}
    placeholder="Enter phone number"
    textContentType="telephoneNumber"
    dataDetectorTypes="phoneNumber"
    maxLength={100}
    keyboardType="phone-pad"
    value={phone}
/>

RN 版本为 0.55

标签： react-nativereact-native-ios

解决方案

如果您在 Mac 上的模拟器上运行，则关键字不会显示，但您如何拥有它没关系。尝试在真实设备上运行它！

看看这个小吃：@abranhe/stackoverflow-56691969

源代码：

import React, { Component } from 'react';
import { View, StyleSheet, TextInput } from 'react-native';

export default class App extends Component {
  state: {
    phone: '',
  };

  render() {
    return (
      <View style={styles.container}>
        <TextInput
          autoFocus
          blurOnSubmit={false}
          placeholder="Enter phone number"
          textContentType="telephoneNumber"
          dataDetectorTypes="phoneNumber"
          maxLength={100}
          keyboardType="phone-pad"
          onChangeText={phone => this.setState({ phone })}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    marginTop: 50,
  },
});

推荐阅读