Fórum Academy - Mudança de Rota

Criador Fabio Ribeiro 17/01/2023

Boa noite Carlos, tenho uma dúvida: Estou fazendo uma aplicação onde o usuário precisa passar por etapas para fazer seu cadastro e salvo em qual estágio o processo está para mostrar a tela correspondente. Não estou conseguindo fazer a condicional para direcionar para a rota certa de cada processo, teria uma ideia como consigo fazer tal direcionamento?

Obrigado

8 comentários

Manager Carlos Ferreira 17/01/2023

Olá, Fabio!
Tudo bem?

Você domina Vue.js?
Com Vue.js você conseguiria matar isso numa boa, porque poderia trabalhar com um form-wizard, e até mesmo validar as partes do formulário diretamente no backend.

Sem alguma tecnologia js no frontend, dificilmente vai conseguir fazer isso sem gambiarra.

Criador Fabio Ribeiro 17/01/2023

Oi Carlos, não conheço muito de Vus.js, somente o que você passou nos cursos, vou instalar na aplicação e fazer os testes.

Obrigado

Manager Carlos Ferreira 17/01/2023

Por nada, qualquer dúvida me retorne que estou à disposição para ajudar.

Criador Fabio Ribeiro 17/01/2023

Boa noite Carlos, estou tentando usar o Vue3 no Laravel 8, mas está me dando o erro:

app.js:22953 Uncaught TypeError: Cannot read properties of undefined (reading 'component')

Eu sei que é no app.js porque quando adiciono ele no meu template blade dá essa mensagem.

O meu app.js está escrito dessa forma:

import { createApp } from "vue";

import Example from "./components/ExampleComponent.vue";

const app = createApp({});

app.component("Example", Example);
app.mount("#app");

Não sei o que pode ter acontecido, já procurei em vários sites e não achei nenhuma solução. Tem alguma ideia do que seja?

Obrigado

Manager Carlos Ferreira 17/01/2023

Olá, Fabio!
Como vai?

Como é um assunto novo, cria uma nova thread (ticket) para discutirmos a sua dúvida.

--

A forma como você declarou está correta (app.component)

Deixa o seu component com um nome full:
app.component("ExampleComponent", ExampleComponent);

Criador Fabio Ribeiro 17/01/2023

Bom dia Carlos, consegui arrumar o projeto do jeito que eu preciso agora com Vue e Vuex. Agora estou com problema no submit do formulário. Estou com esse método no meu form:

    methods: {
        submitClick() {
            this.errors = {};
            axios
                .post("/register", this.form)
                .then((response) => {
                    this.form = {};
                })
                .catch((error) => {
                    this.errors = error.response.data.errors || {};
                });
        },
    },
 

Meu form começa assim:

        <form method="POST" @submit.prevent="submitClick">

O controller da rota está dessa forma:

        event(new Registered($user));

        Auth::login($user);

        return redirect()->route('verification.notice');

A criação do usuário está funcionando sem problema a questão aí é que a página não está sendo direcionada para a rota 'verification.notice', onde eu mostro uma página informando ao usuário verificar o email e validar a conta, mas se der um F5 a página atualiza e vai para essa rota.

Sabe me dizer como fazer esse direcionamento funcionar? O vue-router pode ser usado nesse caso?

Obrigado

Manager Carlos Ferreira 17/01/2023

Olá, Fabio!
Como vai?

Seu frontend está desacoplado do back?

Se não, você pode usar o vue-router para fazer um redirect no .then
Se estiver tudo misturado, pode fazer um window.location.href = "/rota";

Pegou a ideia?

Criador Fabio Ribeiro 17/01/2023

Carlos, muito obrigado mesmo pela ajuda. Estou conseguindo fazer a minha aplicação, só estou com mais uma dúvida mas vou abrir outro ticket.