2017-06-08 9 views
1

を私はリアクトネイティブ通貨入力

" $00.00" 

のようなものとして始まり、入力を始めるときに、その種類セントはまず、その後、(ドルへ移動し、通貨の入力を、作成しようとしていますすなわち、これまでのところ、私はそれがどこユーザーが1つのボックス内の型、および2番目のボックスで正しい形式の出力を表示し、実施している

" $00.50" 

例えば、)最初の右側の数字を更新します。

コード:

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> 

    ); 

} 

しかし、私は、通貨は、ユーザーが入力しているに同じボックスに適用する書式設定します。私はこのようなものを試しました:

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

しかし、これは単純に入力をゼロに設定し、変更することはできません。私は明らかにこれを正しく理解していません。

これについての洞察はありますか?

答えて