在Vue.js中，使用三元运算符确定图像源_Vue.js_Ternary

在Vue.js中，使用三元运算符确定图像源

vue.js

在Vue.js中，使用三元运算符确定图像源,vue.js,ternary,Vue.js,Ternary,我在Vue.js应用程序中有这行代码，它从“属性”列表中的“属性”渲染图像： “：alt=“property.name”class=“card\uuu image”> 如您所见，它有一个用PHP编写的回退，这是可行的。但我只想这样做： <img :src="property.img != null ? property.img.medium : property.img.original" :alt="property.name" class="card__image">

我在Vue.js应用程序中有这行代码，它从“属性”列表中的“属性”渲染图像：


“：alt=“property.name”class=“card\uuu image”>

如您所见，它有一个用PHP编写的回退，这是可行的。但我只想这样做：

<img :src="property.img != null ? property.img.medium : property.img.original" :alt="property.name" class="card__image">

在这种情况下，即使“property.image.original”确实存在于property对象中，这也不起作用，原因是什么？

如果

property.img

为空，那么

property.img.original

将抛出一个

referenceError

三元表达式（条件表达式）很好，问题是当

property.img

为空时，您试图显示

property.img.original

，这是不可能发生的。如果为空，则不能有

original

属性。同样的问题：如何显示

property.img.original

？三元检查是否定义了

propery.img

。如果未定义，它将尝试显示

property.img.original

，这在该条件下没有意义，因为

property.img

未定义。可能

property.img

始终是定义的，如果

medium

未定义，您的意思是显示

original

。如果是这样，请尝试以下操作：

：src=“property.img.medium | | property.img.original”

似乎您误解了一些事情。最好的办法是发布所有代码。如果

property.img

为空，则

property.img.original