vuetify-jsonschema-form
vuetify-jsonschema-form copied to clipboard
koumoul-dev
Not working when schema and data changes
if you change both schema and data, fields are rendered properly but data is not shown (all fields show empty value).
Check this codepen: https://codepen.io/fcordova/pen/GRgZmRz
If you first click 'LOAD DATA 1' form is shown perfectly, but once you click 'form data 2' the form is rendered empty. If you reload the page and begin with data 2, it's also rendered fine but then data 1 can't be rendered anymore.
I will try to make it work in upcoming major version. But I don't want to spend too much time on current version. Can this be solved with a v-if to destroy / recreate the form when the schema changes ?
https://codepen.io/nickjfree/pen/gOpPXpj
Cool, thank you @nickjfree !
@nickjfree if I use your workaround but mix it with a keep-alive component, the result is really bad performance (event binding memory leak maybe?) and strange things appear to happen with inputs where the input loses focus after I type one time.
There's a chance this is specific to my code but I'm wondering if there is a better way for this to be done? Maybe for the form to properly watch the model and update accordingly.
I will need this functionality to behave properly in the relatively near future so if there is no additional work-around or work being done here, I may start on a PR, although I may need a nudge in the right direction from you @albanm.
I tried to look into this a little, but I didn't reach a working solution and reactivity subtleties were giving me headaches. I think even if I were to improve things, perfectly reacting to external changes of both schema and model will never be guaranteed by this library. I strongly suggest working on your side.
I had very similar issue. When the whole value of model is replaced, the form is not updated.
I wanted to cycle through a list of forms by replacing the v-model - it did not work.
The trick with v-if works for me, too.
Instead of v-if it is possible to use :key either on the component or on the form.
<v-jsf :key="nextkey">
This way it is not needed to use this $nextTick function.
