What is the best way to send the result of multiple components via a form (not axios)?

Question

Vue.js

There is a normal form which submits on the submit button.
The form uses several Vue components. Everyone has their own logic, someone loads data via axios, etc. And when you click the submit button, you need to send the result. What is the best way to implement this?

PS: Now I have each component puts the result in its own hidden input, but somehow I don't like it aesthetically...

Answer 1

Now I have each component puts the result in its own hidden input, but somehow I don't like it aesthetically...

Why? I did that too. But more often, even a separate hidden input is not needed.

Answer 2

Now I have each component puts the result in its own hidden input, but somehow I don't like it aesthetically...

But that's how forms work! This is the standard. After all, the form can be sent without Javascript at all.
Another option:
Let your components send data to a common state instead of hidden inputs.
When you click on the submit button, you read the state, generate json and send it where you need it.