#javascript #vue.js #vuejs2 #vue-component
Вопрос:
lt;ul class="ulItems" v-for="item in listingItems" :key="item.channels"gt; lt;li class="liItems"gt; {{ item.itemName }} lt;/ligt; lt;/ulgt; Я хочу отображать изображение в тех случаях, когда в списке нет объекта с таким именем
Ответ №1:
Если я вас правильно понял, попробуйте, например, следующий фрагмент:
new Vue({ el: '#demo', data() { return { listingItems: [{itemName: 'aaa', channels: 1}, {itemName: '', channels: 2}, {itemName: 'bbb', channels: 3}], noNameImg: 'https://picsum.photos/50' } } }) Vue.config.productionTip = false Vue.config.devtools = false lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"gt;lt;/scriptgt; lt;div id="demo"gt; lt;ul class="ulItems" v-for="item in listingItems" :key="item.channels"gt; lt;li class="liItems" v-if="item.itemName"gt; {{ item.itemName }} lt;/ligt; lt;li class="liItems" v-elsegt; lt;img :src="noNameImg" /gt; lt;/ligt; lt;/ulgt; lt;/divgt;