如何在Vue webform中只隐藏一个元素

rkkpypqq  于 2023-03-24  发布在  Vue.js
关注(0)|答案(1)|浏览(142)

我是Vue的新手,试图在加载时隐藏一个处于循环中的webform中的元素。我试图使用v-if和showHideEditComponent方法调用。当我调用showHideEditComponent方法并将uniqueName设置为“DescribeIssue”并返回false时,它会隐藏form上的所有元素。如果我将其设置为true,它将只显示DescribeIsuisse元素。如何在showHideEditComponent方法中只隐藏DescribeIssue并保留所有其他元素,而不使用if、if else、return true、return false...?

<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" 
                 
                  //adding v-if here

                 v-if="showHideEditComponent(field.uniqueName)"
               @blur="onWebFormFieldUpdate">
            </component>
          
        </div>
        
        
showHideEditComponent(uniqueName) {

    if (uniqueName === 'DescribeIssue') {

      return false;     //hides all elements 
      //return true;    // only shows DescribeIssue element
    }
v9tzhpje

v9tzhpje1#

您可以为DescribeIssue添加条件,以便在获取DescribeIssue字段时返回false,而不显示DescribeIssue字段,对于其他字段,您可以在else条件中传递true。

showHideEditComponent(uniqueName) {
    if (uniqueName === 'DescribeIssue') {
        return false;
    } else {
        return true;
    }
}

相关问题