Is it possible to convert an living component instance back to template?
Currently I am working on a form-making website with element-ui and VueJS. I have finish the <preview />
component. It will present the editing result to the user, and now I need to export the whole result form as VueJS template.
Since the result form is simply made up of a whole bunch of element-ui‘s form input components, like <el-input>
, <el-button>
. it might be possible to convert them back to template. But soonly I realized it is not as simple as I throught. I tried doing this by treversing the virtual dom tree, but ended up discorvering that Vue.js doesn’t offer public vnode treversing API. there is an instance attribute named $vnode
, but it is the the placeholder node for the component in parent’s render tree, according to the source code comment. Besides, it’s children property is undefined
. that means I cannot access the children vnodes, thus become impossible to treverse the virtual DOM tree. Another way is use the private property _vnode
, it is feasible way though, but the property is private and I’d rather not touch it, unless I have no other ways.
Another problem I realized later, is that the vdom tree doesn’t keep the informations about v-if
. One the current true
branch will remains in the virtual DOM tree, and I cannot withdraw other false/invisible tags from the vdom tree.
So it looks treversing the DOM tree cannot convert an instance back to template (or maybe I am wrong). Is it some other ways that can accomplish my goal?