Vue - computed and v-for #vue #v-for
<ul>
<li v-for="item in itemsLessThanTen" :key="item.name">
{{ item.name }} - {{ item.price }}
</li>
</ul>
<script>
export default {
data () {
return {
shoppingItems: [
{ name: 'apple', price: '7' },
{ name: 'orange', price: '12' }
]
}
},
computed: {
itemsLessThanTen () {
return this.shoppingItems.filter((item) => {
return item.price > 10
})
}
}
}
</script>