本文共 655 字，大约阅读时间需要 2 分钟。

前言

在项目开发中，用到了一个json editor，因为是vue需要用到，于是借鉴了vue-json-editor源码进行编写了一个符合自己业务的json-editor。

接口

说明：我的保存按钮会根据schema来决定是否可用，如果验证通过了，那么就会向父组件发送事件。

使用方法

有个小问题是：我之所以加v-if，是因为组件在mounted()的时候，初始化并配置了json-editor，此时修改json数据，就会跟着进行验证了，然后schema从后台获取后，虽然给json-editor更新了值，但是规则不管用。故我并没有设置schema的默认值为{}，而是通过v-if异步获取到了jsonSchema再进行渲染。

• 1 npm install jsoneditor -S

// 父组件使用
   

运行截图

源码下载

源码放在了我的GitHub上----->

转载地址：https://blog.csdn.net/qq_39811414/article/details/110842464 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！