Never Play Matchmaker

    v-json-edit

    0.8.0 • Public • Published

    v-json-edit

    Install

    $ npm install --save v-json-edit
    # or
    $ yarn add v-json-edit

    Usage

    import Vue from 'vue'
    import vJsonEdit from 'v-json-edit'
    Vue.use(vJsonEdit)
    <!--开启编辑,拖拽,监听改变, 将on-change修改为change防止与系统冲突-->
    <v-json-edit v-model="json" edit drag @change="changeHandle"></v-json-edit>
    export default {
      data () {
        return {
           json: {} // 渲染值
        }
      },
      methods: {
        changeHandle (val) {
          // 改变值
        }
      }
    }

    API

    Attributes

    参数 说明 类型 默认值 可选值
    v-model 渲染值 String/Object/Array/Number - -
    mode 默认编辑器模式 string tree -
    modes 编辑器模式 array ["tree", "code", "form", "text", "view", "preview"] -
    search 右侧是否展示搜索 boolean false -
    lang 显示语言 string en en, pt-BR, zh-CN, tr, ja, fr-FR
    drag 是否可拖拽 boolean false -
    edit 是否可编辑 boolean false -
    expand 展开所有数据 boolean true -
    history 启用历史记录操作按钮 boolean true -
    mainMenuBar 是否显示主功能栏 boolean true -
    navigationBar 显示树结构上当前位置,适用于: tree/form/view模式 boolean false -

    Events

    事件名称 说明 回调参数
    change 当值进行改变时触发 value
    on-mode 当模式切换时触发 {newMode, oldMode}
    on-error 错误时触发 error
    on-select-text 当选中数据时触发(仅适用于mode: code, 'text') {start, end, text}

    Install

    npm i v-json-edit

    DownloadsWeekly Downloads

    52

    Version

    0.8.0

    License

    MIT

    Unpacked Size

    7.34 kB

    Total Files

    6

    Last publish

    Collaborators

    • cnbrian