你可以使用Vue的计算属性来判断地址是图片还是视频,具体实现如下:

  1. 在Vue组件中定义一个data属性,用来存储地址。
data() {
  return {
    url: 'https://example.com/image.jpg' // 或者是https://example.com/video.mp4
  };
}
  1. 定义一个计算属性,根据地址的后缀来判断是图片还是视频。
computed: {
  isImage() {
    return /\.(jpg|jpeg|png|gif)$/i.test(this.url);
  },
  isVideo() {
    return /\.(mp4|webm|ogg)$/i.test(this.url);
  }
}
  1. 在模板中使用计算属性来判断地址类型,并渲染不同的标签。
<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的计算属性来判断地址是图片还是视频,并根据不同的类型渲染不同的标签。

帮我用vue一个判断地址是图片还是视频

原文地址: https://www.cveoy.top/t/topic/bz6H 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录