如何实现页面导航？

Question

如何实现页面导航？

Answer 1

在HarmonyOS应用中实现页面导航，这种场景一般应用在2个页面直接的交互。
在 config.json 中定义页面路由:

{
  "pages": [
    {
      "path": "/home",
      "component": "HomePage"
    },
    {
      "path": "/detail",
      "component": "DetailPage"
    }
  ]
}

在 HomePage 中添加导航代码:

<!-- HomePage.hml -->
<template>
  <div>
    <button @click="navigateToDetail">Go to Detail Page</button>
  </div>
</template>

<script>
export default {
  methods: {
    navigateToDetail() {
      this.$router.push({ path: '/detail' });
    }
  }
};
</script>