vue中如何实现tabs切换不刷新,以avue-tabs为例
vue中如何实现tabs切换不刷新,以avue-tabs为例示例代码标签使用如下:示例代码下面展示一些 内联代码片。前端代码<template><div class="main"><avue-tabs ref="tabs" :option="tabs.option" @change="handleChange" /><!-- 失活的组件将会被缓存!--&g
·
示例代码
下面展示一些 内联代码片
。
前端代码
<template>
<div class="main">
<avue-tabs ref="tabs" :option="tabs.option" @change="handleChange" />
<!-- 失活的组件将会被缓存!-->
<keep-alive>
<qc-retrieval v-if="'1' === tabs.type.value" />
</keep-alive>
<keep-alive>
<qc-search v-if="'0' === tabs.type.value" />
</keep-alive>
</div>
</template>
标签使用如下:
使用失活标签包裹,可实现切换时刷新的问题:<keep-alive>
<!-- 失活的组件将会被缓存!-->
<keep-alive>
<qc-retrieval v-if="'1' === tabs.type.value" />
</keep-alive>
注意这个 要求被切换到的组件都有自己的名字,不论是通过组件的 name 选项还是局部/全局注册。
更多推荐
已为社区贡献1条内容
所有评论(0)