@@ -32,7 +32,7 @@ import 'vue-prism-editor/dist/VuePrismEditor.css'
32
32
export default {
33
33
data () {
34
34
return {
35
- code: ` Your component boilerplate will be displayed here.` ,
35
+ // code: `Your component boilerplate will be displayed here.`,
36
36
lineNumbers: true ,
37
37
height: null
38
38
}
@@ -42,7 +42,17 @@ export default {
42
42
},
43
43
computed: {
44
44
// needs access to current component aka activeComponent
45
- ... mapState ([' componentMap' , ' activeComponent' , ' activeComponentObj' ])
45
+ ... mapState ([' componentMap' , ' activeComponent' , ' activeComponentObj' ]),
46
+ code : function () {
47
+ let computedCode = ' Your component boilerplate will be displayed here.'
48
+ if (this .activeComponent ) {
49
+ computedCode = this .createCodeSnippet (
50
+ this .activeComponentObj .componentName ,
51
+ this .activeComponentObj .children
52
+ )
53
+ }
54
+ return computedCode
55
+ }
46
56
},
47
57
methods: {
48
58
getWindowHeight (e ) {
@@ -227,24 +237,24 @@ export default {
227
237
},
228
238
watch: {
229
239
// watches activeComponentObj for changes to make it reactive upon mutation
230
- activeComponentObj: {
231
- handler () {
232
- // console.log(this.activeComponentObj.children)
233
- this .code = this .createCodeSnippet (
234
- this .activeComponentObj .componentName ,
235
- this .activeComponentObj .children
236
- )
237
- }
238
- },
240
+ // activeComponentObj: {
241
+ // handler () {
242
+ // // console.log(this.activeComponentObj.children)
243
+ // this.code = this.createCodeSnippet(
244
+ // this.activeComponentObj.componentName,
245
+ // this.activeComponentObj.children
246
+ // )
247
+ // }
248
+ // },
239
249
// watches componentMap for changes to make it reactive upon mutation
240
- componentMap: {
241
- handler () {
242
- this .code = this .createCodeSnippet (
243
- this .activeComponentObj .componentName ,
244
- this .activeComponentObj .children
245
- )
246
- }
247
- }
250
+ // componentMap: {
251
+ // handler () {
252
+ // this.code = this.createCodeSnippet(
253
+ // this.activeComponentObj.componentName,
254
+ // this.activeComponentObj.children
255
+ // )
256
+ // }
257
+ // }
248
258
},
249
259
mounted () {
250
260
// https://vuejs.org/v2/api/#Vue-nextTick
@@ -256,17 +266,17 @@ export default {
256
266
})
257
267
},
258
268
// Updates code snippet when adding children
259
- updated () {
260
- if (this .componentMap [this .activeComponent ]) {
261
- this .code = ` ${ this .createCodeSnippet (
262
- this .activeComponent ,
263
- this .componentMap [this .activeComponent ].children
264
- )} `
265
- // else if there is not existing component/no active component
266
- } else {
267
- this .code = ` Your component boilerplate will be displayed here.`
268
- }
269
- },
269
+ // updated () {
270
+ // if (this.componentMap[this.activeComponent]) {
271
+ // this.code = `${this.createCodeSnippet(
272
+ // this.activeComponent,
273
+ // this.componentMap[this.activeComponent].children
274
+ // )}`
275
+ // // else if there is not existing component/no active component
276
+ // } else {
277
+ // this.code = `Your component boilerplate will be displayed here.`
278
+ // }
279
+ // },
270
280
beforeDestroy () {
271
281
window .removeEventListener (' resize' , this .getWindowHeight )
272
282
}
0 commit comments