Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Component-bound v-model values are not updated #14

Open
snow1101 opened this issue Feb 29, 2024 · 4 comments
Open

Component-bound v-model values are not updated #14

snow1101 opened this issue Feb 29, 2024 · 4 comments

Comments

@snow1101
Copy link

When my component is initialized, the v-model binds to data, and then I paste a piece of code in the editor and find that watch is not triggered
image

@bestkolobok
Copy link
Owner

Hi @snow1101
Try to use v-model:json or v-model:text instead.
v-model doesn't always work the way you expect it to

@zubozrout
Copy link

zubozrout commented Aug 22, 2024

Surprisingly I get the same behavior when trying to work with v-model:json, but v-model:text updates for me just fine.

Edit: As it is more useful to me though I need to do this as a dirty workaround:

:onChange="(content, previousContent, changeStatus) => !changeStatus.contentErrors && updateConfig(content.text)"

where updateConfig updates the value on its own: configData.value = JSON.parse(config);

If this is ever fixed by the editor then it would be a double work to do :(, but I don't have a better solution atm.

@bestkolobok
Copy link
Owner

@zubozrout Thanks for highlighting the problem.

Regarding your case, if I understood correctly, the problem happen when you try to paste a piece of code directly into the editor and get not valid data at the output. So, I want to note that the editor has different behavior depending on the mode (text or tree), and the mode of operation is also determined by whether you use v-model:json or v-model:text, if you have not explicitly specified mode. So, in tree mode (when you use v-model:json), any code you paste into the editor is interpreted as a string. That is, you cannot insert the JSON part, you can only add another field and insert either the name or the value of the field, but in any case, it will be interpreted by the editor as a string. At the same time, in text mode, you can insert a part of a valid JSON into an existing one in the editor, but in text mode, you get only a regular string as an output. This behavior is due to the native behavior of the library I use under the hood. So, you can make a suggestion to change this behavior to the author of this library. And then I'll update update it in vue3-jsoneditor.

Also, in the near future, I will try to experiment with string parsing in text mode, and if it does not break the basic behavior, then I will implement it in vue3-jsoneditor

@zubozrout
Copy link

Thank you very much for your reply @bestkolobok. In my case I am in a v-model:json + text mode, but yes, that doesn't propagate any changes back to the original object on its own. My use case is a simple "download json from a server, edit, save", where in order to save it I need to have the updated data available - hence why I am pushing them back to the original object through the onChange event.

With that being said, I am afraid I am not familiar enough with the svelte-jsoneditor to open up an issue, yet I presume if this is not done right within the library then the approach I've chosen is ok.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants