javascript - 快应用没有触发onShow生命周期功能？

Question

我有一个我正在编写的快速应用程序，其中包含一个快速应用程序页面，该页面仅通过 router.push API 引用单个自定义元素，无法触发该页面的 onShow 生命周期函数。

<import name="listone" src="./aa.ux"></import>
<template>
  <!-- The template can contain only one root node. -->
<listone></listone>
</template>
<script>
  import prompt from '@system.prompt'
  export default {
    private: {
    },
    onInit: function() {
    },
    onShow() {
      console.log('Enter a string whatever you like.');
      prompt.showToast({
        message: 'Enter a string whatever you like.'
      })
    }, // This function cannot be triggered.
  }
</script>
<style>
  .demo-page {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .title {
    font-size: 40px;
    text-align: center;
  }

</style>

还有我的 aa.ux 文件

<template>
  <div class="container">
    <text> Enter some words.</text>
    <text>Enter some words.</text>
    <text>Enter some words.</text>
    <text>Enter some words.</text>
  </div>
</template>

<style>
 .container {
    flex-direction: column;
    justify-content: center;
align-items: center;
background-color: #00fa9a;
  }
</style>

<script>
  module.exports = {
    data: {
    },
    onInit() {
    },
  }
</script>

在这种情况下如何触发 onShow 函数？

Answer 1

我已经找到了问题的“根源”，如果页面的根节点是自定义元素，则快速应用程序加载器不会触发 onShow 生命周期函数。但是，可以为子元素触发该功能。所以对我来说解决这个问题的方法是添加一个额外的 div 元素，如:

<template>
  <!-- The template can contain only one root node. -->
  <div>
    <listone></listone>
  </div>
</template>