Fix table column getColumnIndex undefined bug

[406087475]

Fix table column getColumnIndex undefined bug

Please make sure these boxes are checked before submitting your PR, thank you!

• Make sure you follow contributing guide English | (中文 | Español | Français).
• Make sure you are merging your commits to dev branch.
• Add some descriptions and refer to relative issues for your PR.

[pull-request-triage]

👋 @406087475, seems like this is your first time contribution to element-plus.

• Please make sure that you have read our guidelines and code of conduct before making a contribution.
• You can comment with /label Components:[component_name] to add a label for which component you are working on.
• You may join our for staying tuned.

[github-actions]

[github-actions]

Hello @406087475, thank you for contributing to element-plus, please see our guideline to see how to make contribution

[btea]

Thank you for your contribution, but it is duplicated with #16781.

[Liao-js]

Can you provide a use case scenario where the error occurs?

[Liao-js]

I will close my PR

[ttionya]

Hi, Is this issue still being progressed?

[btea]

@ttionya Hi, can you provide a reproducible example? We have not encountered the corresponding scenario.

[ttionya]

@btea ,

Before providing reproducible code, I would like to confirm a syntax first. I have a scenario where I use v-if and v-else to control whether an el-table-column is displayed. Is this a valid approach?

<el-table-column ... v-if="condition" />
<el-table-column ... v-else />

[btea]

According to the example you provided, you are displaying two different columns under two different conditions?

[ttionya]

According to the example you provided, you are displaying two different columns under two different conditions?

Yes, and this condition is maintained in the store.

[btea]

This is fine if the corresponding fields are different. If it is the same field, and different content is rendered under different conditions, then you can render it according to the condition in the default slot.

[ttionya]

This is fine if the corresponding fields are different. If it is the same field, and different content is rendered under different conditions, then you can render it according to the condition in the default slot.

Thank you for your quick response.

Perhaps indeed there is an issue with my syntax, the prop fields of the two el-table-column are the same, I can indeed write them in the default slot. But I still want to ask, according to the following syntax, should this error not occur? But the error still persists.

<el-table-column prop="notname" v-if="condition"> <!-- prop is not name -->
  <template v-slot="{ row }">
    <el-link>{{ row.name }}</el-link> <!-- use row.name -->
  </template>
</el-table-column>
<el-table-column prop="name" v-else />

[btea]

I tested a simple example and it is normal. link

[ttionya]

I tested a simple example and it is normal. link

Yes, this is not an error that would occur in a simple scenario, otherwise others would have reported it already. :)

Briefly describe the reproduction method, if necessary, I can create a reproducible code example. The specific scenario is that when keepalive is used and it is in an inactive state, the condition changes, then clear the include of keepalive (such as logout), it triggers the onBeforeUnmount event of el-table-column, and then an error is reported.

[btea]

Oh, it seems a bit complicated according to your description. If you have time, please create a repository and provide the simplest reproducible code. Thanks!

[ttionya]

Oh, it seems a bit complicated according to your description. If you have time, please create a repository and provide the simplest reproducible code. Thanks!

@btea Hi, https://github.com/ttionya/element-plus-table-error-repro is a simple example to reproduce the issue. I am happy to discuss any questions. Looking forward to the issue being resolved.