Element 内のテーブルに対する v-show の使用は有効になりませんが、v-if の使用は有効になります。

今日、私の同僚が開発中に問題に遭遇しました。それは、テーブル内の型を使用してテーブル内の 2 つの列を制御し、一方を表示し、もう一方を非表示にし、同時に位置を変更するというものです。タブを切り替えると、2番目のタブに切り替わってしまうバグが見つかりました。 次回からは表示は正しいのですが、位置が変わってしまいます。

そのとき、頻繁に操作されるので v-show に変更することを提案されているように感じましたが、それは機能しませんでした。主にテーブルの td、display: table-cell が、display: none よりも権限が高かったためです。 v-show が失敗する原因となりました。

後からv-ifに変更するしかないのですが、dom操作の過程で同じdomタグが認識できずtdが繰り返し使われることを考慮すると、タグに一意に識別するためのキー値を付加する必要があります。

最終的な解決策は次のとおりです。

<el-table-column key="0" label="解决问题" prop="tableData.date1" v-if="type===0" ></el-table-column>

<el-table-column key="1 " label="発行待ち" prop="tableData.date2" v-if="type!==0" ></el-table-column>

おすすめ

転載: blog.csdn.net/qq_30596783/article/details/121037273