Как при выводе строки ограничить количество отображаемых символов?

Question

[qwentry]

<label class="fileBtn limit-characters form-control form-control-lg">
                  <input @click="currentId='file1'"
                         type="file"
                         id="file1"
                         v-on:change="handleFileUpload"/>
                  <span id="file-name">Прикрепить</span>
                </label>

handleFileUpload: function (event) {
      if (this.currentId === 'file') {
        this.file = event.target.files[0];
        document.getElementById("file-name").innerHTML = this.file.name;
      }
}

Есть "кастомный" input для загрузки файла, имя файла выводится в label.
Как можно сделать вывод имени файла в label в виде Нов...файл.txt?

Answer 1

[0xD34F]

methods: {
  short: str => str.replace(/(?<=^.{3}).{4,}(?=.{8}$)/, '...'),
  ...

<span>{{ file ? short(file.name) : 'Прикрепить' }}</span>

Answer 2

[Валерий Павлов]

let name = "Новый файл.txt";
let new_name = name.substring(0, 3) + "..." + name.substr(-8);