Vue表单循环渲染中如何仅隐藏指定单个元素？

你的问题出在showHideEditComponent方法的返回值逻辑上：当前方法仅在uniqueName === 'DescribeIssue'时返回了false，其他所有情况没有明确返回值，会默认返回undefined——而Vue会把undefined判定为false，导致所有非DescribeIssue的元素也被隐藏。

下面是两种简洁的解决方式，都不需要多分支判断：

方式1：修正方法返回逻辑 #

修改方法，让它默认返回true，仅当目标元素时返回false：

showHideEditComponent(uniqueName) {
  return uniqueName !== 'DescribeIssue';
}

方式2：直接在模板中写判断逻辑（无需额外方法） #

如果逻辑足够简单，也可以直接把判断条件写在v-if里，省去方法定义：

<div v-for="field in Datas" :key="field.key" class="form-row">
  <component 
    :is="getComponentName(field)" 
    :Datas="field"
    :id="'input-ninci-data-' + field.id" 
    v-model="testSelectedRowForEdit.attributeValues[field.uniqueName]"
    :changeLogInfo="testSelectedRowForEdit.changeLogInfos[field.uniqueName]"
    :useVueMultiSelect="field.listAllowMultiple"
    v-if="field.uniqueName !== 'DescribeIssue'"
    @blur="onWebFormFieldUpdate">
  </component>
</div>

内容的提问来源于stack exchange，提问作者Sunny