Блог

Я пытаюсь заставить пользователя добавить имя пользователя при регистрации. Дело в том, что я не хочу разрешать какие-либо символы, кроме подчеркивания (_) и тире (-). Я не знаю, как ограничить разрешенные символы только этими двумя. В настоящее время мой код проверяет минимальную длину, максимальную длину, проверяет, используется ли уже имя пользователя, и обрезает пробелы:

 checkUsername = async() => {
    //Check for minimum length reached
    if(this.state.username.length < 3) { <-------------------------- Check for minimum length
        console.log('Your text is less than what is required.');
    }
    else { <----------------------- Minimum length reached, now we can check database if the username already exists
        await Firebase.firestore()
        .collection('usernames')
        .doc(this.state.username)
        .get()
        .then(function(doc) {
            if (doc.exists) {
                console.log("username in use")
            } else {
                console.log("username is ok");
            }
        }.bind(this));
    }
}

render() {
    return (
        <View style={styles.container}>
            <Text style={styles.headerText}>traderank</Text>
            <TextInput
                style={styles.inputBox}
                value={this.state.username.trim()} <------------------- Get rid of whitespace
                onChangeText={username => this.setState({ username })}
                placeholder='username'
                autoCapitalize='none'
                maxLength={15} <-------------- make sure username does not exceed 15 characters
            />


            <TouchableOpacity 
                style={styles.button} 
                onPress={this.handleSignUp}>
                    <Text style={styles.buttonText}>sign up</Text>
            </TouchableOpacity>

            <Button title="back to login" 
                onPress={() => this.props.navigation.navigate('Login')}/>
        </View>
    )
}
}
 

Я предполагаю, что мне следует добавить логику, чтобы гарантировать, что при проверке минимальной длины используются только тире или подчеркивания, но я понятия не имею, как это сделать. Заранее спасибо.

Я решил проблему, добавив это:

 <TextInput
                style={styles.inputBox}
                value={this.state.username.trim().replace(/[^ws]/gi, "")} <-------------------
                onChangeText={username => this.setState({ username })}
                placeholder='username'
                autoCapitalize='none'
                autoCorrect={false}
                maxLength={15}
            />
 

Замена запрещает все (специальные символы), кроме подчеркивания, букв и цифр. Никаких тире, но пока все в порядке. Если у кого-то есть лучшее решение, я весь внимание!