@@ -106,48 +106,52 @@ plugins: [
106106
107107## Props
108108
109- | Property | Description | Type | Default |
110- | ------------------------ | ----------------------------------------------------------------------------------------------------------------------- | --------------------------------- | ------- |
111- | data(v-model) | JSON data, support v-model when use editable | JSON object | - |
112- | collapsedNodeLength | Objects or arrays which length is greater than this threshold will be collapsed | number | - |
113- | deep | Paths greater than this depth will be collapsed | number | - |
114- | showLength | Show the length when collapsed | boolean | false |
115- | showLine | Show the line | boolean | true |
116- | showLineNumber | Show the line number | boolean | false |
117- | showIcon | Show the icon | boolean | false |
118- | showDoubleQuotes | Show doublequotes on key | boolean | true |
119- | virtual | Use virtual scroll | boolean | false |
120- | height | The height of list when using virtual | number | 400 |
121- | itemHeight | The height of node when using virtual | number | 20 |
122- | selectedValue(v-model) | Selected data path | string, array | - |
123- | rootPath | Root data path | string | ` root ` |
124- | nodeSelectable | Defines whether a node supports selection | (node) => boolean | - |
125- | selectableType | Support path select, default none | ` multiple ` \| ` single ` | - |
126- | showSelectController | Show the select controller | boolean | false |
127- | selectOnClickNode | Trigger select when click node | boolean | true |
128- | highlightSelectedNode | Support highlighting selected nodes | boolean | true |
129- | collapsedOnClickBrackets | Support click brackets to collapse | boolean | true |
130- | renderNodeKey | render node key, or use slot #renderNodeKey | ({ node, defaultKey }) => vNode | - |
131- | renderNodeValue | render node value, or use slot #renderNodeValue | ({ node, defaultValue }) => vNode | - |
132- | editable | Support editable | boolean | false |
133- | editableTrigger | Trigger | ` click ` \| ` dblclick ` | ` click ` |
134- | theme | Sets the theme of the component. Options are 'light' or 'dark', with dark mode enhancing visibility on dark backgrounds | ` 'light' \| 'dark' ` | ` light ` |
109+ | Property | Description | Type | Default |
110+ | ------------------------ | ----------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------- | ------- |
111+ | data(v-model) | JSON data, support v-model when use editable | JSON object | - |
112+ | indent | JSON indent | number | 2 |
113+ | collapsedNodeLength | Objects or arrays which length is greater than this threshold will be collapsed | number | - |
114+ | deep | Paths greater than this depth will be collapsed | number | - |
115+ | showLength | Show the length when collapsed | boolean | false |
116+ | showLine | Show the line | boolean | true |
117+ | showLineNumber | Show the line number | boolean | false |
118+ | showIcon | Show the icon | boolean | false |
119+ | showDoubleQuotes | Show doublequotes on key | boolean | true |
120+ | virtual | Use virtual scroll | boolean | false |
121+ | height | The height of list when using virtual | number | 400 |
122+ | itemHeight | The height of node when using virtual | number | 20 |
123+ | selectedValue(v-model) | Selected data path | string, array | - |
124+ | rootPath | Root data path | string | ` root ` |
125+ | nodeSelectable | Defines whether a node supports selection | (node) => boolean | - |
126+ | selectableType | Support path select, default none | ` multiple ` \| ` single ` | - |
127+ | showSelectController | Show the select controller | boolean | false |
128+ | selectOnClickNode | Trigger select when click node | boolean | true |
129+ | highlightSelectedNode | Support highlighting selected nodes | boolean | true |
130+ | collapsedOnClickBrackets | Support click brackets to collapse | boolean | true |
131+ | renderNodeKey | render node key, or use slot #renderNodeKey | ({ node, defaultKey }) => vNode | - |
132+ | renderNodeValue | render node value, or use slot #renderNodeValue | ({ node, defaultValue }) => vNode | - |
133+ | renderNodeActions | render node actions, or use slot #renderNodeActions | boolean \| ({ node, defaultActions }) => vNode | false |
134+ | editable | Support editable | boolean | false |
135+ | editableTrigger | Trigger | ` click ` \| ` dblclick ` | ` click ` |
136+ | theme | Sets the theme of the component. Options are 'light' or 'dark', with dark mode enhancing visibility on dark backgrounds | ` 'light' \| 'dark' ` | ` light ` |
135137
136138## Events
137139
138140| Event Name | Description | Parameters |
139141| -------------- | ---------------------------------------- | ------------------------------------ |
140142| nodeClick | triggers when click node | (node: NodeData) |
143+ | nodeMouseover | triggers when mouseover node | (node: NodeData) |
141144| bracketsClick | triggers when click brackets | (collapsed: boolean, node: NodeData) |
142145| iconClick | triggers when click icon | (collapsed: boolean, node: NodeData) |
143146| selectedChange | triggers when the selected value changed | (newVal, oldVal) |
144147
145148## Slots
146149
147- | Slot Name | Description | Parameters |
148- | --------------- | ----------------- | ---------------------- |
149- | renderNodeKey | render node key | { node, defaultKey } |
150- | renderNodeValue | render node value | { node, defaultValue } |
150+ | Slot Name | Description | Parameters |
151+ | ----------------- | ------------------- | ---------------------------------------------- | ----- |
152+ | renderNodeKey | render node key | { node, defaultKey } |
153+ | renderNodeValue | render node value | { node, defaultValue } |
154+ | renderNodeActions | render node actions | boolean \| ({ node, defaultActions }) => vNode | false |
151155
152156## Contributors
153157
0 commit comments