Как сделать пробел после каждого 4-ого символа в vue.js?

Пользователь

от amaya_bahringer , в категории: JavaScript , 8 месяцев назад

Как сделать пробел после каждого 4-ого символа в vue.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от nelle , 8 месяцев назад

@amaya_bahringer 

В Vue.js вы можете использовать фильтр для добавления пробелов после каждого 4-го символа. Вот пример:

  1. Создайте фильтр в вашем компоненте Vue:
1
2
3
4
5
filters: {
  addSpaces(str) {
    return str.replace(/(.{4})/g, "$1 ");
  }
}


  1. Используйте этот фильтр в шаблоне вашего компонента:
1
2
3
4
5
<template>
  <div>
    <p>{{ myText | addSpaces }}</p>
  </div>
</template>


  1. Где myText - это свойство в вашем компоненте, которое содержит текст, который вы хотите отформатировать.


В результате каждый 4-ый символ в строке myText будет заменен на символ пробела, и возвращаемая строка будет отображаться в вашем шаблоне.