Skip to content

Commit e5ecc03

Browse files
author
leezng
authored
Merge pull request #52 from leezng/dev
release 1.6.3
2 parents 6c735eb + 41ffbe1 commit e5ecc03

File tree

7 files changed

+31
-8
lines changed

7 files changed

+31
-8
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ yarn-debug.log*
77
yarn-error.log*
88
test/e2e/reports
99
selenium-debug.log
10+
react/
1011

1112
# Editor directories and files
1213
.idea

example/App.vue

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,10 @@
2424
<label>highlightMouseoverNode</label>
2525
<input type="checkbox" v-model="highlightMouseoverNode">
2626
</div>
27+
<div>
28+
<label>collapsedOnClickBrackets</label>
29+
<input type="checkbox" v-model="collapsedOnClickBrackets">
30+
</div>
2731
<div>
2832
<label>deep</label>
2933
<select v-model="deep">
@@ -43,6 +47,7 @@
4347
:show-length="showLength"
4448
:show-line="showLine"
4549
:highlight-mouseover-node="highlightMouseoverNode"
50+
:collapsed-on-click-brackets="collapsedOnClickBrackets"
4651
@click="handleClick">
4752
</vue-json-pretty>
4853
</div>
@@ -96,6 +101,10 @@
96101
<label>highlightSelectedNode</label>
97102
<input type="checkbox" v-model="highlightSelectedNode">
98103
</div>
104+
<div>
105+
<label>collapsedOnClickBrackets</label>
106+
<input type="checkbox" v-model="collapsedOnClickBrackets">
107+
</div>
99108
<div>
100109
<label>deep</label>
101110
<select v-model="deep">
@@ -124,6 +133,7 @@
124133
:show-length="showLength"
125134
:show-line="showLine"
126135
:select-on-click-node="selectOnClickNode"
136+
:collapsed-on-click-brackets="collapsedOnClickBrackets"
127137
v-model="value"
128138
:path-selectable="((path, data) => typeof data !== 'number')"
129139
:selectable-type="selectableType"
@@ -176,6 +186,7 @@ export default {
176186
highlightMouseoverNode: true,
177187
highlightSelectedNode: true,
178188
selectOnClickNode: true,
189+
collapsedOnClickBrackets: true,
179190
path: 'res',
180191
deep: 3,
181192
itemData: {},

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vue-json-pretty",
3-
"version": "1.6.2",
3+
"version": "1.6.3",
44
"description": "A JSON tree view component that is easy to use and also supports data selection.",
55
"author": "leezng <im.leezng@gmail.com>",
66
"main": "vue-json-pretty.js",

src/components/app.vue

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
:visible.sync="visible"
2424
:data="data"
2525
:show-length="showLength"
26+
:collapsed-on-click-brackets="collapsedOnClickBrackets"
2627
:show-comma="notLastKey">
2728
<span v-if="currentDeep > 1 && !Array.isArray(parentData)" class="vjs-key">{{ keyFormatter(currentKey) }}:</span>
2829
</brackets-left>
@@ -51,6 +52,7 @@
5152
:selectable-type="selectableType"
5253
:show-select-controller="showSelectController"
5354
:select-on-click-node="selectOnClickNode"
55+
:collapsed-on-click-brackets="collapsedOnClickBrackets"
5456
:current-key="key"
5557
:current-deep="currentDeep + 1"
5658
@click="handleItemClick"
@@ -62,6 +64,7 @@
6264
<brackets-right
6365
:visible.sync="visible"
6466
:data="data"
67+
:collapsed-on-click-brackets="collapsedOnClickBrackets"
6568
:show-comma="notLastKey">
6669
</brackets-right>
6770
</template>
@@ -164,6 +167,11 @@
164167
type: Boolean,
165168
default: true
166169
},
170+
// collapsed control
171+
collapsedOnClickBrackets: {
172+
type: Boolean,
173+
default: true
174+
},
167175
/* outer props */
168176
169177
/* inner props */

src/components/brackets-left.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@
44

55
<!-- Expand -->
66
<span
7-
v-show="dataVisiable"
7+
v-show="dataVisible"
88
class="vjs-tree__brackets"
99
@click.stop="toggleBrackets">
1010
{{ Array.isArray(data) ? '[' : '{' }}
1111
</span>
1212

1313
<!-- Collapse -->
14-
<span v-show="!dataVisiable">
14+
<span v-show="!dataVisible">
1515
<span
1616
class="vjs-tree__brackets"
1717
@click.stop="toggleBrackets">

src/components/brackets-right.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<div v-show="dataVisiable">
2+
<div v-show="dataVisible">
33
<span
44
class="vjs-tree__brackets"
55
@click.stop="toggleBrackets">

src/mixins/brackets-mixin.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,22 +7,25 @@ export default {
77
data: {
88
required: true
99
},
10-
showComma: Boolean
10+
showComma: Boolean,
11+
collapsedOnClickBrackets: Boolean
1112
},
1213
computed: {
13-
dataVisiable: {
14+
dataVisible: {
1415
get () {
1516
return this.visible
1617
},
1718
set (val) {
18-
this.$emit('update:visible', val)
19+
if (this.collapsedOnClickBrackets) {
20+
this.$emit('update:visible', val)
21+
}
1922
}
2023
}
2124
},
2225
methods: {
2326
// 切换括号展开|关闭
2427
toggleBrackets () {
25-
this.dataVisiable = !this.dataVisiable
28+
this.dataVisible = !this.dataVisible
2629
},
2730
// 括号优化函数, 若不是最后一项, 自动添加逗号
2831
bracketsFormatter (brackets) {

0 commit comments

Comments
 (0)