vue获取判断上传文件后缀名
时间: 2023-11-10 18:08:36 浏览: 66
可以通过以下代码获取上传文件的后缀名:
```javascript
// 获取上传文件的后缀名
let fileExt = ''
if (file.name.lastIndexOf('.') >= 0) {
fileExt = file.name.substr(file.name.lastIndexOf('.') + 1).toLowerCase()
}
// 判断后缀名是否为指定的类型
if (fileExt === 'png' || fileExt === 'jpg' || fileExt === 'jpeg') {
// 处理上传文件
} else {
// 提示用户上传文件格式不正确
}
```
其中,`file` 是一个包含上传文件信息的对象。如果文件名中包含了后缀名,则使用 `substr` 方法获取后缀名,否则后缀名为空字符串。最后,根据后缀名判断是否为指定的类型进行处理。
相关问题
vue字符串截取文件后缀名
在Vue中,你可以使用字符串的一些方法来截取文件的后缀名。一个常见的方法是使用`split()`,将字符串根据特定的分隔符分割成数组,然后取数组的最后一个元素作为后缀名。例如,你可以这样写代码来截取文件的后缀名:
```javascript
let str = "http://dskdfj2/wode.doc";
let fileName = str.split(".").pop();
```
在这个例子中,`split(".")`将字符串按照`.`进行分割,得到一个数组`["http://dskdfj2/wode", "doc"]`。然后使用`pop()`方法取数组的最后一个元素`"doc"`作为文件的后缀名。
如果你需要截取多个文件路径中的后缀名,你可以使用循环来遍历每个文件路径,并将结果存储在一个数组中。
```javascript
let picArr = "http://dskdfj2/wode.doc,https://jdfjkjfw/wode.pdf,http://jdsjfkds/wode.jpg";
let fileExtensions = [];
if (picArr) {
let files = picArr.split(",");
for (let i = 0; i < files.length; i++) {
let fileName = files[i].split(".").pop();
fileExtensions.push(fileName);
}
}
console.log(fileExtensions);
```
在上面的代码中,`picArr`是一个包含多个文件路径的字符串。通过使用`split(",")`将字符串分割成一个文件路径的数组,然后使用`split(".")`和`pop()`来截取每个文件路径的后缀名,并将结果存储在`fileExtensions`数组中。
请注意,这只是一个示例代码,你可以根据你的实际需求进行修改和适配。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [正则判断文件后缀名](https://blog.csdn.net/weixin_43764828/article/details/109536123)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* [普歌-uniapp/vue根据文件路径后缀显示相应的icon图标,在uniapp中点击文件打开新页面查看文件](https://blog.csdn.net/weixin_45491473/article/details/110957525)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
vue2截取文件后缀名
以下是在Vue2中截取文件后缀名的方法:
1. 在template中添加一个input和一个button,用于输入文件名和触发截取操作:
```html
<template>
<div>
<input v-model="fileName" placeholder="请输入文件名" />
<button @click="getSuffix">截取后缀名</button>
</div>
</template>
```
2. 在script中定义fileName和getSuffix方法:
```javascript
<script>
export default {
data() {
return {
fileName: ''
}
},
methods: {
getSuffix() {
const suffix = this.fileName.substring(this.fileName.lastIndexOf('.') + 1)
console.log(suffix)
}
}
}
</script>
```
3. 在getSuffix方法中使用substring和lastIndexOf方法截取文件后缀名,并将其输出到控制台中。