Vue 项目中如何动态选择图片？

vue中，如何处理动态图片选择

问题描述

在 vue 项目中，需要根据不同条件动态显示图片。已有一个包含选中状态的 select 对象和一个 fruitData 数组，但 v-for 中的条件判断无法正常工作。

展现代码

let select = {
  boluo: false,
  caomei: false,
};

let fruitData = [{
  key: 'boluo',
  select: 'url',
  noSelect: 'url'
}, {
  key: 'caomei',
  select: 'url',
  noSelect: 'url'
}];

<view v-for="(item,index) in fruitData">
  @@##@@
</view>

解决方案

对象后面‘.’一般都是具体的变量名，后面直接跟‘[]’,中括号里面可以是变量。因此，正确的代码应该是：

select[item.key] ? item.select : item.noSelect

以上就是Vue 项目中如何动态选择图片？的详细内容，更多请关注其它相关文章！