隐藏el-table-infinite-scroll组件时，出现以下error:Error in directive el-table-infinite-scroll unbind hook: "TypeError: Cannot read property 'container' of undefined

[wulilele]

Error in directive el-table-infinite-scroll unbind hook: "TypeError: Cannot read property 'container' of undefined

[yujinpan]

Hi，你是通过什么方式隐藏组件的？

[wulilele]

Hi，你是通过什么方式隐藏组件的？

通过v-if条件渲染

[yujinpan]

我刚试过用 v-if 控制显示隐藏，但未报错，请问你的详细步骤是？

[wulilele]

<template>
    <div class="tabbox">
       <template v-if="type">
                <el-table
                        :data="list"
                        ref="table"   
                        v-el-table-infinite-scroll="loadingList"
                >
                    <el-table-column
                            prop="name"
                            label="名称"
                    >
                    </el-table-column>

                </el-table>
            </template>
            <template v-else>面板2</template>
    </div>
</template>

<script>
    import elTableInfiniteScroll from 'el-table-infinite-scroll';
    export default {
        name: "Index",
        directives: {
            'el-table-infinite-scroll': elTableInfiniteScroll
        },
        data() {
            return {
                type: true,
                list: [],
            }
        },
        mounted() {
            this.type = false   //初始隐藏滚动加载
        },
        methods: {           
            getList() {

            }
        },
    }
</script>

<style scoped>

</style>

[yujinpan]

在 mounted 阶段隐藏 table 组件确实会造成报错问题。 因为 v-el-table-infinite-scroll 会在 mounted 之后进行 setTimeout 才初始化完成。此时隐藏 table 组件，会使指令的 unbind 优先 bind 执行，所以造成了报错。

不过，这样的写法并不常见（在 mounted 进行状态的初始化），为何不在 data 里面定义好初始化的状态呢？

[wulilele]

在 mounted 阶段隐藏 table 组件确实会造成报错问题。 因为 v-el-table-infinite-scroll 会在 mounted 之后进行 setTimeout 才初始化完成。此时隐藏 table 组件，会使指令的 unbind 优先 bind 执行，所以造成了报错。

不过，这样的写法并不常见（在 mounted 进行状态的初始化），为何不在 data 里面定义好初始化的状态呢？

明白了，感谢