Vue-json-pretty-fast NPM

vue-json-pretty-fast

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

Install

npm install vue-json-pretty-fast

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	-