Нарезать URL-адрес, чтобы получить имя файла в формате Vue

Question

У меня есть URL-адрес файла, и мне нужно разрезать его, чтобы показать файл пользователям. Я успешно нарезал его, используя substring, но что, если строка для нарезки не зафиксирована. Вот так /media/users/3/sample.docx. Я хотел показать только sample.docx, поэтому я использовал substring, но что, если числа перед этим увеличиваются, как число 3? Как это сделать лучше?

sliceString(value) {
   return value.substring(15)
}

{{sliceString(data.file)}}

Answer 1

Возьмите последний индекс /, добавьте к нему 1 и используйте в методе substring:

sliceString(value) {
    let lastSlashIndex=value.lastIndexOf('/')
    return value.substring(lastSlashIndex+1)
}

Пример:

let url = 'sample.com/media/users/3/sample.docx'

let lastIndex= url.lastIndexOf('/');

console.log(url.substring(lastIndex+1))

Answer 2

Вы можете использовать регулярное выражение, чтобы сделать это так

const url = 'sample.com/media/users/3/sample.docx'

console.log(url.match(/[^\/]+$/)[0])

Answer 3

Это должно сузить URL-адрес до имени файла, даже если есть параметры строки запроса:

const fileString = 'file:///folder1/folder2/folder3/filename.extension?possibleQueries';
sliceURL = ((url) => {
    lastChar = url.length;
    if (url.lastIndexOf('?') > -1) {
        lastChar = url.lastIndexOf('?');
    };
    return (url.substring(url.lastIndexOf("/") + 1, lastChar));
})
(fileString); // Expected output: "filename.extension"

Answer 4

Попробуйте использовать value.lastIndexOf()

 sliceString(value) {
     return value.substring(value.lastIndexOf("/")+1)
 }

 {{sliceString(data.file)}}

Answer 5

Попробуйте использовать split :

const url = 'sample.com/media/users/3/sample.docx';
url = url.split('/');
len = url.length;
const sample = url[len-1];
console.log(sample) // 'sample.docx'