关于element tab标签切换加载闪一下的问题

因为我这里是作为公共组件,而且调用都是插在 dialog里的,切换tab很明显的能看到table样式会有闪一下的情况,正常页面用的话是没有这一问题的,我说的只是我的,你的还得你自己亲测!言归正传,怎么解决呢?其实很简单,就是用v-if指令来控制它!往哪加,请看下面代码:

<el-tabs v-model="activeName2" type="card">
            <el-tab-pane label="项目基本信息" name="first">
                <template>
                    <el-row class="msgSty"> 
                        <el-col :span="12">
                            <div class="grid-content bg-purple">
                                <p class="overflowText">招标项目业务编号:</p>
                            </div>
                        </el-col>
                        <el-col :span="12">
                            <div class="grid-content bg-purple">
                               <a href="javascript:void(0)">piupiu</a>
                            </div>
                        </el-col>
                    </el-row>
                </template>
            </el-tab-pane>
            <el-tab-pane label="项目标包划分" name="second">                      
                <template>
                    <div class="tableBox">
                        <el-table
                            v-if="activeName2 === 'second'"
                            :data="tableData"
                            style="width: 100%"
                            >
                            <el-table-column prop="idNum" label="序号"></el-table-column>
                            <el-table-column prop="proNum" label="标包业务编号"></el-table-column>
                            <el-table-column prop="proName" label="标包名称"></el-table-column>
                            <el-table-column prop="bagType" label="标包内容分类"></el-table-column>
                            <el-table-column prop="yesOrNo" label="是否参与"></el-table-column>
                            <el-table-column prop="mode" label="招标方式"></el-table-column>
                        </el-table>
                    </div>
                </template>
            </el-tab-pane>
        </el-tabs>

例如v-if=“activeName === ‘second’”

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值