vue.js保持活动和事件呈现

Question

我有1个主要组成部分和2个孩子。 在主人，我做：

  <keep-alive>
    <component :is="getChild" @onrender="childRender" />
  </keep-alive>

所以我从孩子1切换到孩子2并保持每个孩子的状态。

• getChild切换子组件（按钮...在这里不是问题）。
• 加载子项时会发出onrender
• childRender只需编写一个console.log。

问题：当我们使用keep-alive时，子组件不会重新渲染，而当我使用onCreated或onMounted或onUpdated ...时，没有任何追加，这是正常的。那么如何通过keep-alive捕捉“渲染”事件呢？

我知道我可以使用公共汽车或Vuex这样的商店来保持状态...但我不希望这样做。

谢谢。

Answer 1

  

在2.2.0+及更高版本中，激活和停用都会触发树中所有嵌套组件。

使用激活的生命周期挂钩。

export default {
  activated() {
    this.$emit("activated");
  }
}

Vue.js文档链接：https://vuejs.org/v2/api/#keep-alive

现场演示，您可以在其中玩<keep-alive>：https://codepen.io/3vilArthas/pen/BeZgbE