vxe-table-column in vue+vxe-table combined with v-if leads to confusion in column style and position

Problems encountered when using vxe-table_Tan CV's blog-CSDN blog_[vxe-table] The toolbar cannot be associated with the table

vxe-table-column in vue+vxe-table combined with v-if causes confusion in column styles and positions

According to requirements, when judging the display and hiding of a certain column of vxe-table, problems such as column position confusion, table header style changes, and problems with values ​​but not being displayed often occur;< a i=1> Note: This problem is not a technical issue    <vxe-table-column             v-if="pageInfo.id === 4 ||pageInfo.id === 8"             title="Report Type"             width="100"             v-if="row.reportType == 1">API</span>             10>                                                                                                                        

   <vxe-table-column 
           v-if="pageInfo.id === 4 ||pageInfo.id === 8" 
           title="上报类型" 
           width="100" 
           key='1'>
          <template v-slot="{row}">
            <span v-if="row.reportType == 1">API</span>
            <span v-else>咨询工具</span>
          </template>
    </vxe-table-column>
    //或者
       <vxe-table-column 
           v-if="pageInfo.id === 4 ||pageInfo.id === 8" 
           title="上报类型" 
           width="100" 
           :key="Math.random()">
          <template v-slot="{row}">
            <span v-if="row.reportType == 1">API</span>
            <span v-else>咨询工具</span>
          </template>
    </vxe-table-column>

给使用了v-if的列，加一个固定的key值，或循环渲染key即可；
————————————————
版权声明：本文为CSDN博主「莎莉哇」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/ShaLiWa/article/details/119773845