Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Desculpe, mas não consegui implementar a validação ao finalizar uma tarefa

Referente ao curso Vue3: avançando no framework, no capítulo Notificando os usuários e atividade Desafio: Validando as tarefas

por Francielle Borges Zucolota
| 14.7k xp | 6 posts

Pessoal/professor @Vinícius Neves,

Me desculpe, mas eu não consegui implementar o código de desafio do professor Vinícius Neves, para implementar a validação ao finalizar uma tarefa.

Onde e como implemento-o?

Código do desafio:

      const projeto = this.projetos.find((p) => p.id == this.idProjeto);
      if (!projeto) {
        this.store.commit(NOTIFICAR, {
          titulo: 'Ops!',
          texto: "Selecione um projeto antes de finalizar a tarefa!",
          tipo: TipoNotificacao.ERRO,
        });
        return;
      }

.....

O que eu não entendi, é que já tem um "salvarTarefa()" ali no "methods", e seria ali dentro que seria para implementar, não é? >. <

Código do projeto:

//Caminho relativo do arquivo: src/components/Formulario.vue

methods: {
 salvarTarefa (tempoEmSegundos: number) : void {    
      this.$emit('aoSalvarTarefa', {
        duracaoEmSegundos: tempoEmSegundos,
        descricao: this.descricao,
        projeto: this.projetos.find(proj => proj.id == this.idProjeto)
      })
      this.descricao = ''
    }
  },

Mas não consegui implementar o código do desafio, como posso implementá-lo?

Desde já agradeço.

Garanta sua matrícula hoje e ganhe + 2 meses grátis

Continue sua jornada tech com ainda mais tempo para aprender e evoluir

Quero aproveitar agora
2 respostas
solução!
por Vinicios Neves
| 1037.6k xp | 1161 posts
Instrutor Tech Lead

Olá, Francielle!

Não tem problema, o importante é tentar! To orgulhoso de ti pelo esforço, inclusive por postar aqui pra gente conseguir trocar essas figurinhas.

O código final pode ficar assim:

{
    // restante do código omitido...
    methods: {
        salvarTarefa(tempoEmSegundos: number): void {
            const projeto = this.projetos.find((p) => p.id == this.idProjeto); // primeiro, buscamos pelo projeto
            if(!projeto) { // se o projeto não existe...
                this.store.commit(NOTIFICAR, {
                    titulo: 'Ops!',
                    texto: "Selecione um projeto antes de finalizar a tarefa!",
                    tipo: TipoNotificacao.ERRO,
                }); // notificamos o usuário
                return; // ao fazer return aqui, o restante do método salvarTarefa não será executado. chamamos essa técnica de early return :)
            }
            // se o projeto existe, seguimos normalmente...
            this.$emit('aoSalvarTarefa', {
                duracaoEmSegundos: tempoEmSegundos,
                descricao: this.descricao,
                projeto: projeto
            })
            this.descricao = ''
        }
    },
    // restante do código omitido...
}

Alguma coisa nessa linha. Que achou da solução? :)

por Francielle Borges Zucolota
| 14.7k xp | 6 posts

Oie professor Vinícius!

Nossa, observando o seu código agora entendi melhor.

Antes, eu estava tentando firmemente adicionar o código de desafio dentro do "$emit". hahah

Mas como o "$emit" é um objeto, a sintaxe nunca que receberia uma declaração de variável ou if. XD

E então faz muito mais sentido trabalhar com a variável "projeto" e a declaração "if" fora do "$emit".

Mais uma vez, muito obrigada. Tenha um bom dia!

Atenciosamente, Fran ^^