Reagieren-einheimische Währung input

Ich versuche zu schaffen, eine Währung, Eingang, beginnt so etwas wie

" $00.00"

dann, wenn Sie mit der Eingabe beginnen, es Typen die Cent zuerst, dann bewegt sich auf den Dollar (ie, updates der rechten Seite, Nummer), e.g

" $00.50"

Bisher habe ich es umgesetzt, wo der Benutzer eingibt in eine box, und die korrekt formatierte Ausgabe zeigt in einer zweiten box.

Code :

constructor(props) {
    super(props);


    this.state = {
        amount: '',
    };

}

formatValue(value) {
    return accounting.formatMoney(parseFloat(value) / 100, "$ ");
}

render() {
    return (
        <ScrollView>

            <Text style={styles.text}> Enter the Amount to be payed</Text>
                <TextInput
                    onChangeText={(amount) => this.setState({amount})}>
                </TextInput>

                <TextInput
                    onChangeText = {amount => this.setState({amount})}                  
                    value={this.formatValue(this.state.amount)}>                        
                </TextInput>

        </ScrollView>

    );

}

Allerdings möchte ich die Währung Formatierung für das gleiche Feld der Benutzer ist Eingabe in der. Ich habe versucht, so etwas wie dieses:

<TextInput 
        onChangeText={(amount) => this.setState({amount})}
        value = {this.formatValue(this.state.amount)}>
</TextInput>

aber das stellt einfach den Eingang auf null, und es kann nicht geändert werden. Ich bin eindeutig nicht verstehen das richtig.

Hat jemand irgendwelche Informationen zu dieser?

Haben Sie eine gute Lösung für dieses problem?

InformationsquelleAutor Razor88 | 2017-06-08

Schreibe einen Kommentar