如何使用react-native更改Textinput中的电话号码格式

Question

我想要的电话号码（工作电话）格式如下图所示，使用react-native，任何人都可以帮忙解决问题，任何帮助非常感谢

Answer 1

您可以使用正则表达式实现此目标...格式应为（555）222-9999

onTextChange(text) {
    var cleaned = ('' + text).replace(/\D/g, '')
    var match = cleaned.match(/^(1|)?(\d{3})(\d{3})(\d{4})$/)
    if (match) {
        var intlCode = (match[1] ? '+1 ' : ''),
            number = [intlCode, '(', match[2], ') ', match[3], '-', match[4]].join('');

        this.setState({
            phoneNum: number
        });

        return;
    }

    this.setState({
        phoneNum: text
    });
}

然后在<TextInput> ...

<TextInput 
    onChangeText={(text) => this.onTextChange(text) }
    value={this.state.phoneNum}
    textContentType='telephoneNumber' 
    dataDetectorTypes='phoneNumber' 
    keyboardType='phone-pad' 
    maxLength={14}
/>

Answer 2

我不认为它与反应原生有关。您只需要使用手机格式化JavaScript库。试试这个：http://www.phoneformat.com/ 然后用它的输出设置字段的状态。