在使用tab切換時,由於使用的表格列,有時候會有不同,使用v-if做判斷,在切換時,往往沒有很准確的顯示和隱藏掉相關列;
會錯亂的寫法:
1 <el-table-column v-if="activeName === 'three' ">金額數</el-table-column>
2 <el-table-column v-if="activeName === 'first' ">訂單數</el-table-column>
正確的寫法:
1 <el-table-column v-if="activeName === 'three' " key="1">金額數</el-table-column>
2 <el-table-column v-if="activeName === 'first' " key="2">訂單數</el-table-column>
給使用了v-if的列,加一個固定的key值,這樣子不會存在此問題了。
或者這樣子也是可以的
1 <el-table-column v-if="activeName === 'three' " :key="Math.random()">金額數</el-table-column>
2 <el-table-column v-if="activeName === 'first' " :key="Math.random()">訂單數</el-table-column>