File tree Expand file tree Collapse file tree 7 files changed +31
-8
lines changed Expand file tree Collapse file tree 7 files changed +31
-8
lines changed Original file line number Diff line number Diff line change @@ -7,6 +7,7 @@ yarn-debug.log*
7
7
yarn-error.log *
8
8
test /e2e /reports
9
9
selenium-debug.log
10
+ react /
10
11
11
12
# Editor directories and files
12
13
.idea
Original file line number Diff line number Diff line change 24
24
<label >highlightMouseoverNode</label >
25
25
<input type =" checkbox" v-model =" highlightMouseoverNode" >
26
26
</div >
27
+ <div >
28
+ <label >collapsedOnClickBrackets</label >
29
+ <input type =" checkbox" v-model =" collapsedOnClickBrackets" >
30
+ </div >
27
31
<div >
28
32
<label >deep</label >
29
33
<select v-model =" deep" >
43
47
:show-length =" showLength"
44
48
:show-line =" showLine"
45
49
:highlight-mouseover-node =" highlightMouseoverNode"
50
+ :collapsed-on-click-brackets =" collapsedOnClickBrackets"
46
51
@click =" handleClick" >
47
52
</vue-json-pretty >
48
53
</div >
96
101
<label >highlightSelectedNode</label >
97
102
<input type =" checkbox" v-model =" highlightSelectedNode" >
98
103
</div >
104
+ <div >
105
+ <label >collapsedOnClickBrackets</label >
106
+ <input type =" checkbox" v-model =" collapsedOnClickBrackets" >
107
+ </div >
99
108
<div >
100
109
<label >deep</label >
101
110
<select v-model =" deep" >
124
133
:show-length =" showLength"
125
134
:show-line =" showLine"
126
135
:select-on-click-node =" selectOnClickNode"
136
+ :collapsed-on-click-brackets =" collapsedOnClickBrackets"
127
137
v-model =" value"
128
138
:path-selectable =" ((path, data) => typeof data !== 'number')"
129
139
:selectable-type =" selectableType"
@@ -176,6 +186,7 @@ export default {
176
186
highlightMouseoverNode: true ,
177
187
highlightSelectedNode: true ,
178
188
selectOnClickNode: true ,
189
+ collapsedOnClickBrackets: true ,
179
190
path: ' res' ,
180
191
deep: 3 ,
181
192
itemData: {},
Original file line number Diff line number Diff line change 1
1
{
2
2
"name" : " vue-json-pretty" ,
3
- "version" : " 1.6.2 " ,
3
+ "version" : " 1.6.3 " ,
4
4
"description" : " A JSON tree view component that is easy to use and also supports data selection." ,
5
5
"author" : " leezng <im.leezng@gmail.com>" ,
6
6
"main" : " vue-json-pretty.js" ,
Original file line number Diff line number Diff line change 23
23
:visible.sync =" visible"
24
24
:data =" data"
25
25
:show-length =" showLength"
26
+ :collapsed-on-click-brackets =" collapsedOnClickBrackets"
26
27
:show-comma =" notLastKey" >
27
28
<span v-if =" currentDeep > 1 && !Array.isArray(parentData)" class =" vjs-key" >{{ keyFormatter(currentKey) }}:</span >
28
29
</brackets-left >
51
52
:selectable-type =" selectableType"
52
53
:show-select-controller =" showSelectController"
53
54
:select-on-click-node =" selectOnClickNode"
55
+ :collapsed-on-click-brackets =" collapsedOnClickBrackets"
54
56
:current-key =" key"
55
57
:current-deep =" currentDeep + 1"
56
58
@click =" handleItemClick"
62
64
<brackets-right
63
65
:visible.sync =" visible"
64
66
:data =" data"
67
+ :collapsed-on-click-brackets =" collapsedOnClickBrackets"
65
68
:show-comma =" notLastKey" >
66
69
</brackets-right >
67
70
</template >
164
167
type: Boolean ,
165
168
default: true
166
169
},
170
+ // collapsed control
171
+ collapsedOnClickBrackets: {
172
+ type: Boolean ,
173
+ default: true
174
+ },
167
175
/* outer props */
168
176
169
177
/* inner props */
Original file line number Diff line number Diff line change 4
4
5
5
<!-- Expand -->
6
6
<span
7
- v-show =" dataVisiable "
7
+ v-show =" dataVisible "
8
8
class =" vjs-tree__brackets"
9
9
@click.stop =" toggleBrackets" >
10
10
{{ Array.isArray(data) ? '[' : '{' }}
11
11
</span >
12
12
13
13
<!-- Collapse -->
14
- <span v-show =" !dataVisiable " >
14
+ <span v-show =" !dataVisible " >
15
15
<span
16
16
class =" vjs-tree__brackets"
17
17
@click.stop =" toggleBrackets" >
Original file line number Diff line number Diff line change 1
1
<template >
2
- <div v-show =" dataVisiable " >
2
+ <div v-show =" dataVisible " >
3
3
<span
4
4
class =" vjs-tree__brackets"
5
5
@click.stop =" toggleBrackets" >
Original file line number Diff line number Diff line change @@ -7,22 +7,25 @@ export default {
7
7
data : {
8
8
required : true
9
9
} ,
10
- showComma : Boolean
10
+ showComma : Boolean ,
11
+ collapsedOnClickBrackets : Boolean
11
12
} ,
12
13
computed : {
13
- dataVisiable : {
14
+ dataVisible : {
14
15
get ( ) {
15
16
return this . visible
16
17
} ,
17
18
set ( val ) {
18
- this . $emit ( 'update:visible' , val )
19
+ if ( this . collapsedOnClickBrackets ) {
20
+ this . $emit ( 'update:visible' , val )
21
+ }
19
22
}
20
23
}
21
24
} ,
22
25
methods : {
23
26
// 切换括号展开|关闭
24
27
toggleBrackets ( ) {
25
- this . dataVisiable = ! this . dataVisiable
28
+ this . dataVisible = ! this . dataVisible
26
29
} ,
27
30
// 括号优化函数, 若不是最后一项, 自动添加逗号
28
31
bracketsFormatter ( brackets ) {
You can’t perform that action at this time.
0 commit comments