<div id="app">
<ul v-if="fruit.length">
<li v-for="fruit in fruit">
{{ fruit.item }}
</li>
</ul>
<p v-else>No fruit left!</p>
</div>
var vm = new Vue({
el: '#app',
data: {
fruit: [
{ item: 'apple' },
{ item: 'banana' }
]
}
})
This Pen doesn't use any external CSS resources.