帮我用vue一个判断地址是图片还是视频
你可以使用Vue的计算属性来判断地址是图片还是视频,具体实现如下:
- 在Vue组件中定义一个data属性,用来存储地址。
data() {
return {
url: 'https://example.com/image.jpg' // 或者是https://example.com/video.mp4
};
}
- 定义一个计算属性,根据地址的后缀来判断是图片还是视频。
computed: {
isImage() {
return /\.(jpg|jpeg|png|gif)$/i.test(this.url);
},
isVideo() {
return /\.(mp4|webm|ogg)$/i.test(this.url);
}
}
- 在模板中使用计算属性来判断地址类型,并渲染不同的标签。
<template>
<div>
<img v-if="isImage" :src="url" alt="image">
<video v-else-if="isVideo" :src="url" controls></video>
<span v-else>不支持的文件类型</span>
</div>
</template>
这样就可以通过Vue的计算属性来判断地址是图片还是视频,并根据不同的类型渲染不同的标签。
原文地址: https://www.cveoy.top/t/topic/bz6H 著作权归作者所有。请勿转载和采集!