Empty v-for iteration: v-empty
EDIT If you find this issue, the discussion was moved to https://github.com/vuejs/rfcs/discussions/256
What problem does this feature solve?
For Vue 3 I would like to submit to your consideration a Vue 2 feature request that was rejected: vuejs/vue#4174
It's a simple way to have content when a v-for
iteration is empty, which would work similarly to v-if
/ v-else
.
The original request called it v-empty
but I don't care about its name.
It's nice sugar for something that is very common in UI, but more importantly it's hard to emulate when you are iterating over something that doesn't have a length, such as an iterator/generator.
You can see that even after being closed, comments of the original issues are getting a lot of thumbs up: Issue itself: 👍 16 https://github.com/vuejs/vue/issues/4174#issuecomment-388338342 👍 23 https://github.com/vuejs/vue/issues/4174#issuecomment-608024212 👍 13
What does the proposed API look like?
<template>
<div v-for="x of iterator">{{ x }}</div>
<div v-empty>Empty!</div>
<template>
Or any other name.