Nourished Personal Mucus

    vue-json-pretty-slashpath

    1.3.6 • Public • Published

    vue-json-pretty

    Build Status npm package GitHub license

    A vue 2.x component for rendering JSON data as a tree structure.

    • basic: JSON pretty
    • advanced: get item data from JSON

    Links

    Install

    npm install vue-json-pretty

    Usage

    <template>
      <div>
        ...
        <vue-json-pretty
          :path="'res'"
          :data="{ key: 'value' }"
          @click="handleClick">
        </vue-json-pretty>
      </div>
    </template>
    import VueJsonPretty from 'vue-json-pretty'
     
    export default {
      components: {
        VueJsonPretty
      }
    }

    Props

    • If you are using only the basic features (JSON pretty), just focus on the base properties.
    • If you are using advanced features (get item data), you need to focus on the base and advanced attributes.
    Attribute Level Description Type Default
    data basic json data JSON object -
    deep basic data depth, data larger than this depth will not be expanded number Infinity
    path advanced root data path string root
    pathChecked advanced defines the selected data path array []
    pathSelectable advanced defines whether a data path supports selection Function(itemPath, itemData) -
    selectableType advanced defines the selected type, this feature is not supported by default enum: both, checkbox, tree -

    Events

    • The following events are base on advanced features.
    Event Name Description Callback Parameters
    click triggered when a data item is clicked (path, data)

    Install

    npm i vue-json-pretty-slashpath

    DownloadsWeekly Downloads

    3

    Version

    1.3.6

    License

    MIT

    Unpacked Size

    46.4 kB

    Total Files

    40

    Last publish

    Collaborators

    • dean99dean