Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

Bernd's avatar
Level 1

Extending/Replacing the register process with a Vue Component

Hi, I'm new to Spark and Vue.js and I am trying to extend the spark registration process. I want a multi step form, so I created a RegisterForm Component and four sub components for the steps. I can not wire it up with the built in Component, though. I want to use the built in register Method of the Spark Register process. If I'm not mistaken this is in auth/register-stripe.js. So far i put my custom register Component into the register-stripe.js via mixin, which gives me access to object, where the form data is stored in and the register method.

    Vue.component('spark-register-stripe', {
        mixins: [base, customRegister],
        methods: {
            submit(){
                this.register();
            }
        },
    });

So far so good, but here comes the part were I fail: I want to get access to the registerForm.errors. Since my custom register with all the template and the child components are a mixin, I can't pass the registerForm through. Maybe my attempt is "not the way to do it", so I would be happy to hear some suggestions how to achieve that.

Here are things I thought about: I could put the Register Form Logic right into the spark-register-stripe Component. However I can't manage to get the template in a regular .js file (I use .vue files for the other components) - how can I convert the .js file to a .vue file (the code changes are clear, but includes in some places then fail) Also I edited the file in the spark-components file, is this right, or should I copy it into the components? How would I "tell" the application to use my file then?

Thanks in advance!

0 likes
1 reply
Bernd's avatar
Level 1

Never mind. I managed to make the component to a .vue file and get the template into it.

Please or to participate in this conversation.