示例代码

下面展示一些 内联代码片。

前端代码

<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 选项还是局部/全局注册。