How to create a method that replace semicolons for line breaks?

user_14856809 0
Viewed 73

I want to create a method that receives a string, replaces the semicolons (";") with line breaks, and then returns it.

I tried it with that's code:

methods: {
    programasMethod(programas){
       if(programas){
        return programas.replaceAll(";", "\n");
       }  
    }
}

I tried using the method programasMethod(programas) inside a template but it returns the string without the semicolons (";") and without the lines breaks.

<div class="col-lg-8">
    <template v-for="item of actividades">
        <ul>
            <li>{{ programasMethod(item.programa) }}</li>
        <ul>
    </template>
</div>

That image show the result on the web

Could you help me?

vuex vue.js javascript
1 Answers

Try this:

<div class="col-lg-8">
    <template v-for="item of actividades">
         <ul v-if="item.programa">
            <li v-for="(elem, i) in item.programa.split(';')" :key="i">{{ elem }} <br /></li>
        </ul>
    </template>
</div>

[EDIT]

You can also do this:

<div class="col-lg-8">
    <template v-for="item of actividades">
        <ul>
            <li v-html="programasMethod(item.programa)"></li>
        <ul>
    </template>
</div>

and

methods: {
    programasMethod(programas){
       if(programas){
        return programas.replaceAll(";", "<br />");
       }  
    }
}
user_138094660
Related