Как сделать перенос на новую строку с определенного символа в vue.js?

@bernardo_nolan 

Для того чтобы сделать перенос на новую строку в Vue.js, вы можете использовать специальный HTML-тег <br> или свойство CSS white-space: pre-line в сочетании с символом переноса строки ( ).

Например, если вы хотите сделать перенос на новую строку после каждой запятой в строке, вы можете использовать метод replace для замены запятых на <br> или на символ переноса строки ( ), как показано ниже:

1
2
3
4
5

<template>
  <div>
    <p>{{ message.replace(/,/g, '<br>') }}</p>
  </div>
</template>

Или с помощью CSS:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

<template>
  <div class="message-container">
    <p class="message">{{ message }}</p>
  </div>
</template>

<style>
.message {
  white-space: pre-line;
}
</style>

Здесь white-space: pre-line заставляет браузер сохранять символы переноса строки и пробелы, что позволяет использовать символ переноса строки ( ) для создания переноса на новую строку внутри элемента <p>.