Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

Como usar uma função interna ao método adiciona() ?

Eu queria fazer de uma forma na qual eu criasse o método limparForm() dentro do método adiciona, já que esse método nesse contexto só tem sentido existir quando a negociação é criada.

    adiciona(event) {

        function createNegociacao(data, quantidade, valor) {
            return new Negociacao(data, quantidade, valor);
        }

        function limparForm() {
            this._inputData.value = "";
            this._inputQuantidade.value = "";
            this._inputValor.value = "";

            this._inputData.focus();
        }

        event.preventDefault();
        let data = new Date(...
            this._inputData.value
            .split('-')
            .map((item, indice) => item - indice % 2)
        );

        let negociacao = createNegociacao(data, this._inputQuantidade.value, this._inputValor.value)

        limparForm();
        console.log(negociacao);
    }

Mas quando envio o form, ele aparece que o campo _inputData está undefined imagino que por conta desse this que não significa o contexto do objeto NegociacaoController.

De que forma eu poderia fazer isso?

6 respostas

Oi Leonardo tudo bem?

Você poderia tirar o this e especificar o elemento que quer pegar. O que acha?

Eu tentei fazer isso utilizando somente

    adiciona(event) {

        function createNegociacao(data, quantidade, valor) {
            return new Negociacao(data, quantidade, valor);
        }

        function limparForm() {
            _inputData.value = "";
            _inputQuantidade.value = "";
            _inputValor.value = "";

            _inputData.focus();
        }
}

Mas ele me retorna:

inputData is not defined

tenta usar o document.forms[0] para selecionar o seu formulário.

Primeiro, eu queria entender por que o código que eu criei não funciona. É por causa do this que não está no contexto?

E também queria saber se não existe uma forma que eu posso fazer isso dentro da função adiciona().

Se eu criar esse método fora da função adiciona, ele funciona normalmente.

E não entendi direito o que fazer com esse document.forms[0]. Ele me retorna o form mas eu acessaria o campo com o querySelector normal?

solução!

Consegui resolver aqui mas gostaria de saber se essa é a melhor forma de resolver.

    adiciona(event) {

        let self = this;

        function createNegociacao(data, quantidade, valor) {
            return new Negociacao(data, quantidade, valor);
        }

        function limparForm(self) {
            self._inputData.value = "";
            self._inputQuantidade.value = 1;
            self._inputValor.value = 0.0;

            self._inputData.focus();
        }

        event.preventDefault();
        let data = new Date(...
            this._inputData.value
            .split('-')
            .map((item, indice) => item - indice % 2)
        );

        let negociacao = createNegociacao(data, this._inputQuantidade.value, this._inputValor.value)

        limparForm(this);
        console.log(negociacao);
    }

Eu criei a variável self recebendo a referência do objeto NegociacaoController e com isso eu consegui ter acesso aos atributos da instância. Essa forma é uma forma aceitável ?

Oi Leonardo, é a minha ideia era pegar o forms e depois pegar os elementos filhos por ele mas a sua ideia é bem melhor e totalmente aceitável.

É o this não tava pegando por causa do contexto porque não era mais o mesmo this mas você resolveu o problema de uma ótima forma pois fica reaproveitável , o meu se eu mudasse alguma coisa no html da página talvez tivesse que mudar.

Mas como é um projeto didático nem nos preocupemos tanto com a melhor forma de fazer mas sim aprender de tudo um pouco. No dia a dia da empresa quem define as regras é o supervisor ou membro mais experiente da equipe.

Bons estudos!!!