Is it possible to print something inside a Function (forEach)? Vue.Js, JavaScript

Question

I am working on Vuetify form generator and I want to print the generated code in the proper format.

Is it possible to print something inside a forEach function?

GiveMeCode() {
  this.Dialog = true
   this.SourceCode =
        `<template>
     <v-form ref="Form">
         <v-container class="text-center">` +
        +`</v-container>
     </v-form>
 </template>
`
}

Something like:(which actually returns undefined)

GiveMeCode() {
  this.Dialog = true
   this.SourceCode =
        `<template>
     <v-form ref="Form">
         <v-container class="text-center">` +
            this.Fields.forEach(Field => {"ITERATE & PRINT SOMETHING HERE & USE DATA PROPERTIES"})
        +`</v-container>
     </v-form>
 </template>
`
}

I want to use forEach loop to iterate the code. If that's not the best way what another way should I use to iterate the loop and print the output accordingly.

This is how my code syntax highliter look like. I am using Vue & Vuetfiy. <PrismEditor readonly:code="SourceCode" language="vue"></PrismEditor><v-card-text>

Any help would be much appreciated

Answer 1

I assume GiveMeCode() is a computed property? It seems kind of odd to put that much markup into a computed property.

You should have your markup already in your template. You can show/hide it via v-if/v-show if you need to.

Regarding your list of fields I think you have 2 options depending on what your data is (hard to tell without more context).

You can iterate over your items via v-for and spit out whatever you need. The other option would be to create a custom filter . Filters allow you to neatly extract your formatting code into it's own function.