88 <li
99 :id =" item[itemId]"
1010 class =" g8-tree__node"
11- :class =" { 'g8-tree__node--expended': expanded }"
11+ :class =" { 'g8-tree__node--expended': hasChild && expanded }"
1212 >
1313 <div
1414 class =" g8-tree__node__entry"
@@ -86,44 +86,44 @@ export default class G8VueTree extends Vue {
8686 /**
8787 * Key of the field in `item` to be used as element's `id` attribute.
8888 */
89- @Prop ({ default: ' id' }) itemId! : string ;
89+ @Prop ({ default: ' id' }) private itemId! : string ;
9090
9191 /**
9292 * Key of the field in `item` that holds node label.
9393 */
94- @Prop ({ default: ' name' }) itemLabel! : string ;
94+ @Prop ({ default: ' name' }) private itemLabel! : string ;
9595
9696 /**
9797 * Key of the field in `item` that holds tags array.
9898 */
99- @Prop ({ default: ' tags' }) tagsKey! : string ;
99+ @Prop ({ default: ' tags' }) private tagsKey! : string ;
100100
101101 /**
102102 * Key of the field in `item` that holds child nodes array.
103103 */
104- @Prop ({ default: ' children' }) childrenKey! : string ;
104+ @Prop ({ default: ' children' }) private childrenKey! : string ;
105105
106106 /**
107107 * Key of the field in tags list of `item` to be used as tag element's `id`
108108 * attribute.
109109 */
110- @Prop ({ default: ' id' }) tagId! : string ;
110+ @Prop ({ default: ' id' }) private tagId! : string ;
111111
112112 /**
113113 * Key of the field in tags list of `item` that holds tag label.
114114 */
115- @Prop ({ default: ' label' }) tagLabel! : string ;
115+ @Prop ({ default: ' label' }) private tagLabel! : string ;
116116
117117 /**
118118 * Key of the field in tags list of `item` that holds tag tooltip.
119119 */
120- @Prop ({ default: ' hint' }) tagHint! : string ;
120+ @Prop ({ default: ' hint' }) private tagHint! : string ;
121121
122122 /**
123123 * Whether to add a checkbox before each item, allowing multiple nodes to
124124 * be checked.
125125 */
126- @Prop ({ default: false }) checker! : boolean ;
126+ @Prop ({ default: false }) private checker! : boolean ;
127127
128128 /**
129129 * The tree data to be rendered. Please note that data passed ***may*** be
@@ -134,39 +134,39 @@ export default class G8VueTree extends Vue {
134134 * - intermediate
135135 * - rendered
136136 */
137- @Prop () item! : G8TreeItem ;
137+ @Prop () private item! : G8TreeItem ;
138138
139139 /**
140140 * Whether the node is expanded.
141141 */
142- expanded = false ;
142+ private expanded = false ;
143143
144144 /**
145145 * Whether the node is checked. This must be a member field in order for
146146 * binding to work.
147147 */
148- checked = false ;
148+ private checked = false ;
149149
150150 /**
151151 * Intermediate check box state. Active while some of the children were
152152 * checked, but not all were checked. This must be a member field in order for
153153 * binding to work.
154154 */
155- intermediate = false ;
155+ private intermediate = false ;
156156
157157 /**
158158 * Whether the current node has any child.
159159 */
160- get hasChild(): boolean {
160+ private get hasChild(): boolean {
161161 const children = this .item [this .childrenKey ] as G8TreeItem [] | null ;
162162 return children != null && children .length > 0 ;
163163 }
164164
165- // noinspection JSUnusedGlobalSymbols
165+ // noinspection JSUnusedLocalSymbols
166166 /**
167167 * Vue life cycle hook {@link https://vuejs.org/v2/api/#created } .
168168 */
169- created() {
169+ private created() {
170170 this .checked = this .item .checked as boolean ;
171171 this .intermediate = this .item .intermediate as boolean ;
172172 }
@@ -177,7 +177,7 @@ export default class G8VueTree extends Vue {
177177 * This method emits the `state-changed` event.
178178 * @param state
179179 */
180- setState(state : boolean ) {
180+ private setState(state : boolean ) {
181181 this .checked = this .item .checked = state ;
182182 if (this .$children && this .$children .length ) {
183183 // descend to all descendant sub-components and update their states,
@@ -207,7 +207,7 @@ export default class G8VueTree extends Vue {
207207 * Handles click event of nodes, expanding/collapsing sub-tree if
208208 * applicable. This method emits the `click` event.
209209 */
210- clicked(event : G8ClickEvent ) {
210+ private clicked(event : G8ClickEvent ) {
211211 if (this .hasChild ) {
212212 this .item .rendered = true ;
213213 this .expanded = ! this .expanded ;
@@ -226,7 +226,7 @@ export default class G8VueTree extends Vue {
226226 * `state-changed` event.
227227 * @param node
228228 */
229- childrenStateChanged(node : G8TreeItem ) {
229+ private childrenStateChanged(node : G8TreeItem ) {
230230 let checked = 0 ;
231231 const children: G8TreeItem [] = this .item [this .childrenKey ] as G8TreeItem [];
232232 for (const child of children ) {
0 commit comments