Как использовать значение в Cleave JS реагирует - PullRequest
Новая
       10

Как использовать значение в Cleave JS реагирует

0 голосов
/ 06 января 2020

Я хочу использовать Cleave js для формата валюты. Мой тэг Cleave выглядит следующим образом: 

<Cleave className="input-numeral" 
        name="loanAmount"
        options={{  numeral:            true,
                    numeralDecimalMark: ',',
                    delimiter:          '.' 
                }}
        value={this.props.loanAmount} 
        onChange={this.props.handleChange}
 />

Предположим, если на входе 82456,56

Я хочу вывести что-то вроде этого: 82,456,56. Код работает нормально, если я не использую пропозицию 'value' в этом. Но мне нужно использовать значение, поскольку мне нужно отформатировать начальное значение из реквизита.

Что мне делать в этом случае, чтобы сначала прочитать значение из реквизита, а затем изменить его в соответствии с пользовательским вводом?

1 Ответ

0 голосов
/ 06 января 2020

Вы можете попробовать что-то вроде этого: 

class SampleComponent extends React.Component{
  constructor(props){
    super(props);
    this.onChange = this.onChange.bind(this);
    this.state = {
        value : props.loanAmount
    };
}

onChange(event) {
    this.setState({
        value: event.target.value
    });
    this.props.handleChange();
}

render() {
    return <Cleave className="input-numeral" 
            name="loanAmount"
            options={{  numeral:            true,
                        numeralDecimalMark: ',',
                        delimiter:          '.' 
                    }}
            value={this.state.value} 
            onChange={this.onChange}
    />
}

}

...