项目要求满足条件的不进行循环渲染，直接内嵌在同一个地方，不满足条件的继续循环渲染
代码如下：
//此处是表单结构
<template>
<el-form
class='data-render-form'
:label-width="config['label-width']"
:label-position="config['label-position']"
:size="config['size']">
<el-row>
<template
v-for="(option, idx) in options"
>
<FormItem
:option="option"
:key="idx + ''"
v-show="formItemShow(option)"
>
</FormItem>
</template>
</el-row>
</el-form>
</template>
//此处是表单的item
<template>
<el-col :sm="option['col'] ? option['col'] : 24" :xs="24">
<el-form-item
:class="[
`form_item-${option.use}`
]"
v-if="!isRemove"
v-show="!isHide">
<template slot="label">
<template v-if="option.label">
<span v-if="!option.tips">
{{ option.label }}
</span>
<el-tooltip v-else placement='bottom'>
<div slot='content'>
<p v-html="option.tips"></p>
</div>
<div>
<span>{{ option.label }}</span>
<i class='el-icon-warning'></i>
</div>
</el-tooltip>
</template>
<template v-if="option.use === 'f-richtext'">
<el-tooltip placement='bottom'>
<div slot='content'>
<p>
{{ $t('若背景与文字为同一颜色导致看不清文字，可在此修改富文本编辑器的背景色') }}
</p>
</div>
<div class="lay-i-b lay-va-m">
<el-color-picker v-model="richtextBG"></el-color-picker>
</div>
</el-tooltip>
</template>
</template>
<template>
<component v-if="option.key" v-model="currentVal" :is="componentName" v-bind="option.attrs" ref="currentInput"></component>
<component v-else :is="componentName" v-bind="option.attrs"></component>
<p class="f-s-12" v-if="option.desc" v-html="option.desc"></p>
</template>
</el-form-item>
</el-col>
</template>
当option['fold']中有条件满足时直接在同一个FormItem中内嵌渲染，不满足的情况下继续渲染新的FormItem
例如：
有三个option中的option['fold']['show-img']等于"yes",但是这三个option不是相邻的，要内嵌到第一个option所生成的FormItem中形成折叠目录，要怎么实现
