jinkin1995 / vue-json-edit

Visual JSON editor built as an vue component. Provides a basic GUI

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Should add a watch for "objData"

ZakZhengZq opened this issue · comments

no need

no need

I love this comment lol

Yes, there is a need obviously because in the current state, you can't swap the json value after the initial component load because the only time you actually bind (well, technically you parse) the data is on component load. So any time you pass the data afterwords - nothing happens.

Unfortunately instead of using computed properties, you bind the data from the passed prop onto the component state on component load - this alone makes it non-reactive as mentioned, and since you use watchers on said state - adding a simple watcher for objData will kick your component into a permanent loop since the change will get passed down to child components which emit the change back up to their parent on any state change.

What you can do to work around this issue (unless you want to rewrite the whole ting again) is add another prop for "JsonEditor" component and create a watcher for that one

watch:{ updatedJson(newVal){ this.parsedData = this.jsonParse(newVal) } }

This will do the same thing as the original author did on component load and substitute your old JSON without triggering the infinite loop since once you change the parsed data, that component will instantly emit the new value back up to your original parent prop