Skip to main content
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
adicionou 7 caracteres ao conteúdo
Fonte Link

Estou desenvolvendo um projeto, e ao digitar um valor em um campo necessito que o outro campo seja alterado com base nos valores que defini em uma função, por exemploaqui está o código:

Estou desenvolvendo um projeto, e ao digitar um valor em um campo necessito que o outro campo seja alterado com base nos valores que defini em uma função, por exemplo:

Estou desenvolvendo um projeto, e ao digitar um valor em um campo necessito que o outro campo seja alterado com base nos valores que defini em uma função, aqui está o código:

Fonte Link

Alterar campo dinamicamente no ReactJs

Estou desenvolvendo um projeto, e ao digitar um valor em um campo necessito que o outro campo seja alterado com base nos valores que defini em uma função, por exemplo:

 constructor(props) {
    super(props);
    this.state = {
        rendimentoMes: '',
        risco: '',

    }


}

changeRendimentoMesHandler= (event) => {
    this.setState({rendimentoMes: event.target.value});
}

changeRiscoHandler= (event) => {
    this.setState({risco: event.target.value});
}

Na função abaixo eu faço a verificação do valor que será inserido no campo Rendimento Mensal, que deveria impactar no campo risco:

defineRisco(){
    if (this.state.rendimentoMes != null){
        if (this.state.rendimentoMes > 6000){
            this.state.risco = "A";
        } else if (this.state.rendimentoMes > 1000 && this.state.rendimentoMes <= 8000){
            this.state.risco = "B";
        } else {
            this.state.risco = "C";
        }
    }
}

E aqui está o meu render, onde deveria ser atualizado dinamicante de acordo com o valor do campo Rendimento mensal. Estou tentando realizar dessa forma, alguém me ajuda a saber onde estou errando?

render() {
        return (
            <div>

                                <div className="form-group">
                                    <label> Rendimento Mensal: </label>
                                    <input type ="Number" placeholder="Rendimento Mensal:" name="rendimentoMes" className="form-control"
                                    value={this.state.rendimentoMes} onChange={this.changeRendimentoMesHandler} blur={this.defineRisco} />
                                </div>

                                <div className="form-group">
                                    <label> Risco: </label>
                                    <input disabled type ="Number" placeholder="" name="risco" className="form-control"
                                           value={this.state.risco} onChange={this.defineRisco()} />
                                </div>
                            </form>
                        </div>

                    </div>
                </div>


            </div>
        )
    }