elementui el-tab页面切换如何自动刷新当前页面？

问题描述：

当tab页面第一次切换时会自动刷新页面，但当第二次再切换到该页面是不自动刷新，如何让每次切换都刷新问题。

解决方法：

去掉keep-alive。子组件修改监听事件。

keep-alive：主要用于保留组件状态或避免重新渲染。

父组件原代码（无法实现切换自动刷新）：

<el-tabs v-model="activeName"  @tab-click="handleClick" type="border-card">
            <el-tab-pane label="测试2" name="firth">
                <keep-alive>
                    <child4  :params="curPageIndex" myidx="4"></child4>
                </keep-alive>
            </el-tab-pane>
            <el-tab-pane label="测试1" name="first">
                <keep-alive>
                    <child1   :params="curPageIndex" myidx="1"></child1>
                </keep-alive>
            </el-tab-pane>
            <el-tab-pane label="测试3" name="first" v-else>
                <keep-alive>
                    <child1   :params="curPageIndex" myidx="1"></child1>
                </keep-alive>
            </el-tab-pane>
            <el-tab-pane label="测试4" name="second">
                <keep-alive>
                    <child2   :params="curPageIndex" myidx="2"></child2>
                </keep-alive>
            </el-tab-pane>
</el-tabs>

1、父组件修改后代码：去掉了keep-alive。

<el-tabs v-model="activeName"  @tab-click="handleClick" type="border-card">
            <el-tab-pane label="测试2" name="firth">
               <child4  :params="curPageIndex" myidx="4"></child4>
            </el-tab-pane>
            <el-tab-pane label="测试1" name="first">
               <child1   :params="curPageIndex" myidx="1"></child1>
            </el-tab-pane>
            <el-tab-pane label="测试3" name="first" v-else>
                <child1   :params="curPageIndex" myidx="1"></child1>
            </el-tab-pane>
            <el-tab-pane label="测试4" name="second">
                <child2   :params="curPageIndex" myidx="2"></child2>
            </el-tab-pane>
</el-tabs>

2、子组件也就是child 使用watch来监听el-tabs中是哪个tab被点击，使用属性props对父组件中的属性进行声明，但是监听时需要添加 immediate:true，handler（）{}，才能起作用。

完美解决问题。

watch: {
    '$props.params' :{
        immediate:true,
        handler(){
            if (this.$props.myidx == this.$props.params) {
                this.getWork();
            }
        }
    }
},
props:['params', 'myidx']