my-json-editor
基于 jsoneditor 开发的 vue3 json editor，支持全屏编辑，有完善的事件回调，可以在失去焦点时，对编辑器内容做校验。
json-editor-vue3
参考json-editor-vue3实现，加入 vite 打包压缩，将 jsoneditor 集成打包，减少需要自主安装 jsoneditor 的工作量。
项目地址
依赖
- Vue 3.0.0+
- jsoneditor
安装方式
pnpm install my-json-editor
全局引入方式
//全局引入
import Vue from 'vue';
import JsonEditor from 'my-json-editor';
const app = createApp(App);
app.use(JsonEditor).mount('#app'); //使用方式：<JsonEditor></JsonEditor>局部引入方式
//局部引入
import JsonEditor from 'my-json-editor';模板使用
<json-editor class="editor" v-model="data" />参数
| Name | Type | Description | Default |
|---|---|---|---|
| modelValue | Object | 要编辑的 json 值 | |
| options | Object | jsoneditor 的 options，参考configuration-options | |
| currentMode | String | 当前编辑模式 | code |
| modeList | Array | 可选的编辑模式列表 | ["tree", "code", "form", "text", "view"] |
| language | Array | 语言 | en |
事件
| Name | Description |
|---|---|
| update:modelValue | json 更新 |
| change | json 更新 |
| textSelectionChange | 参考configuration-options对应参数，参数有重写，第一个参数为编辑器的实例，后续参数与官方参数相同 |
| selectionChange | 同上 |
| focus | 同上 |
| blur | 同上 |
| colorPicker | 同上 |