我在夏天早些时候编写了这段代码,然后v-card-media因v-img而贬值了。据我所知,我正确地使用了v-img,并通过指定的src属性传递了源代码。
另一个问题提到了类似的问题,有人建议v-img无法与过时的浏览器一起使用:Vuetify v-img组件未加载图像
我拥有最新版本的firefox和chrome,而v-img在两种情况下均不会显示链接的图像。我知道信息正在传递,因为所有其他数据都显示得很好。我想知道这可能是链接安全性方面的问题,还是与我忽略的链接有关的某些配置问题。有人提到某个地方(我现在忘记了现在的地方),vue在从自定义组件的相对链接加载图像时遇到问题,但是我传递的链接使用的是http。此外,我传递的图像在列表组件的头像拼贴中显示得很好,因此我认为问题特别与v-img有关。
都一样,我对正在发生的事情一无所知。我在下面粘贴了相关代码。如果有人对此有所了解,将不胜感激。
<template>
<div id="eventCard">
<v-container fluid grid-list-xl pb-0 grid-list-lg grid-list-md grid-list-xs>
<v-layout row wrap>
<v-flex
v-for="item in shows"
class="xs12 sm6 md4 xl4"
>
<v-card flat>
<v-img
class="secondaryFont--text"
height="300"
src="item.avatar"
alt=""
>
<v-container fill-height fluid>
<v-layout fill-height max no-margin>
<v-flex xs12 align-end flexbox max no-padding>
<v-container class="banner max">
<v-layout xs12 row>
<v-flex xs12 md9 v-if="item.title && item.acts" class="title">
<span class="clip-text">
{{item.title}}
<span>(</span>
<span v-if="item.acts" v-for="(act, index) in item.acts">
<span>{{act.name}}</span><span v-if="index+1 < item.acts.length">, </span>
</span>
<span>)</span>
</span> …Run Code Online (Sandbox Code Playgroud)