vue-print-object
A component to print and collapse javascript objects
Features
- Print javascript objects
- Highlighting of different types (number, string, boolean, etc)
- Collapsible: collapse keys
- Highlight of complete objects on hover
Installation
Via npm
First add it to your package.json
:
npm install vue-print-object --save# or yarn yarn add vue-print-object
<script>
tag
Or manually via If you don't use npm you can download the minified version in dist/vue-print-object.min.js
and the css in dist/vue-print-object.css
, then add it to your site:
Loading the minified version will automatically register the component VuePrintObject
globally on the browsers window
object.
Usage
Import the component js and css (alternatively copy and customize the css):
Then load the component:
// globallyVue // or in a component components: PrintObject
Finally use the component:
{ myObject: a: 1 b: "hello" c: d: 3 4 e: false }
Options
name | type | description |
---|---|---|
printable-object | Object |
The object that you want to print |
initial-collapsed | Boolean or Array |
Set to true to collapse all keys by default. Set an array of strings to collapse only specific keys. |
Examples
Basic example
{ myObject: a: 1 }
Collapse all keys by default
{ myObject: a: 1 b: c: 2 d: e: 3 }
Collapse specific keys by default
{ myObject: a: 1 b: c: 2 d: e: 3 }
License
MIT