Add an event when FormulateForm is intialized/mounted

[Rednas83]

Currently you can only guess when the form is initialized.

I think there are 2 possible solutions for this

Solution 1: Trigger the input event after the form is fully loaded

  <FormulateForm
    v-model="data"
    :schema="items"
    @input="update($event)" // Emitted on change (only after mounted event and when the form is fully initialized!) 
/>

Solution 2: Add an additional event

  <FormulateForm
    v-model="data"
    :schema="items"
    @input="update($event)" //  Emitted on change (only after mounted!)
    @mounted="update($event)" //  Emitted when the form is fully initialized/mounted
  />

Actual behaviour

  <FormulateForm
    v-model="data"
    :schema="items"
    @input="update($event)" // Emitted on change (also during mount/initialization! Why is this necessary?)
   />

[justin-schroeder]

A created event has been added in release/2.5.1.

[Rednas83]

Doesn't seems to work anymore
https://codepen.io/rednas83/pen/ZEBomOM

I am also not able to find it in the docs anywhere.

[justin-schroeder]

release/2.5.1 is a branch, it hasn't been published yet.

[Rednas83]

Great! Will you also block the input event during creation (so that only the user is able to change inputs)?

[justin-schroeder]

Unfortunately I don’t understand what you’re asking for @Rednas83. Can you give me an example of what/how this is useful?

[Rednas83]

The use is
*More speed on loading the form ( input event is only triggered after creation, preventings scripts to run unnecessarily)
*Simpler debugging (because there are much less events on the bus => 1 after creation and 1 for each input event)
*Perhaps no need anymore for the created event?

I think it also makes more sense because the input event is intended for input changes from the user.

Expected behaviour

  <FormulateForm
    v-model="data"
    :schema="items"
    @created="update($event)" // Emitted when the form is fully initialized/mounted
    @input="update($event)" // Emitted on change (only after mounted event and when the form is fully initialized!) 
/>

Actual behaviour

  <FormulateForm
    v-model="data"
    :schema="items"
    @input="update($event)" // Emitted on change (also during mount/initialization! Why is this necessary?)
   />

[Rednas83]

Just noticed an issue with the new created event. It's also triggered when items is undefined or asynchronous (ie: promise).

[justin-schroeder]

@Rednas83 the created event really has nothing to do with the schema. it's based on the form. If you dont provide anything for the form to render, the form still get's created. Perhaps in your created handler you could check if items is falsey.

[Rednas83]

...But if you provide an asynchronous schema it will also trigger the created event before the form is actually rendered. I think the created event should be blocked as long items is still a promise.

You can do this by checking if Array.isArray(items) or by !items.then (promises have a then method).

[justin-schroeder]

Sure, but that request is specific only if the form is using a schema. The created event is not specific to your particular implementation. The created event is accurately triggered when the FormulateForm is created. If you have other async things going on in user land, those are not really in the scope of the project. if you want to only trigger the @created event when your schema mounts, why not just put a v-if on the FormulateForm for something like v-if="items.length".

[Rednas83]

I don't understand. Why would you emit the created event if there is no form (schema=undefined) or if the schema is still pending (schema=promise)?

This is now my actual behaviour

The created event is emitted before the form is actually created.

[justin-schroeder]

the form is literally the <form> object. that mounts immediately. I think maybe you're expecting the created event to act like a "schema-mounted" event which currently does not exist. Feel free to submit a feature request or PR for that instead.

This created event, as far as i can tell, is working as intended. It fires when the form is created (and for most cases that is the same fields mounting).