循环遍历内容为空时，li还占空位

<ul class="content">
		<li  :key="item.label"  v-for="item of listData">
			<el-checkbox v-if="isShow" v-model="item.checked"></el-checkbox>
			<div class="li-label" v-if="item.checked || isShow">{{ item.label }}:</div>
			<div class="li-content" v-if="item.checked || isShow">{{ item.content }}</div>
		</li>
	</ul>

	以上代码出现的问题：1.当内容为空时，li还占位，导致、
	![图片1](https://img-blog.csdnimg.cn/20200423094445367.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2h1cnJpY2FuZXdqcw==,size_16,color_FFFFFF,t_70)
	解决办法：

<ul class="content">
			<template v-for="item of listData">
				<li v-if="item.checked || isShow" :key="item.label">
					<el-checkbox v-if="isShow" v-model="item.checked"></el-checkbox>
					<div class="li-label" v-if="item.checked || isShow">{{ item.label }}:</div>
					<div class="li-content" v-if="item.checked || isShow">{{ item.content }}</div>
				</li>
			</template>
		</ul>

	将循环遍历生成放在template上面
	最后实现效果![在这里插入图片描述](https://img-blog.csdnimg.cn/20200423093911842.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2h1cnJpY2FuZXdqcw==,size_16,color_FFFFFF,t_70)

更优解决方案：将数据处理好后，再遍历生成