uni-app vue3版本 pages.json页面路由全局配置中onPageNotFound不存在时页面重定向跳转没反应

在uni-app中，Vue3版本对于页面路由的全局配置，特别是处理404页面（即页面未找到时）的重定向，确实需要仔细配置。pages.json是uni-app用于定义页面路由、导航栏、选项卡等页面级配置的文件。当onPageNotFound不存在或者配置不正确时，页面重定向可能无法正常工作。

下面是一个正确的配置示例，以及如何在pages.json中设置404页面重定向的代码案例。

首先，确保你的pages.json文件中包含了onPageNotFound的配置项。这个配置项用于指定当用户访问一个不存在的页面时，应该跳转到的页面路径。

{
  "pages": [
    // 其他页面配置...
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "首页"
      }
    },
    // ... 其他页面配置
    {
      "path": "pages/404/404", // 404页面路径
      "style": {
        "navigationBarTitleText": "页面未找到"
      }
    }
  ],
  "globalStyle": {
    // 全局样式配置...
  },
  "tabBar": {
    // tabBar配置（如有）...
  },
  "condition": {}, // 条件编译配置（如有）...
  "onPageNotFound": "pages/404/404" // 当页面未找到时，跳转到404页面
}

在上面的配置中，onPageNotFound被设置为"pages/404/404"，这意味着当用户尝试访问一个不存在的页面时，应用会自动跳转到pages/404/404这个页面。

确保你的项目中确实有一个名为404.vue的文件位于pages/404/目录下，并且这个文件是一个有效的Vue组件。例如：

<template>
  <view class="container">
    <text>页面未找到</text>
  </view>
</template>

<script>
export default {
  name: 'Page404'
}
</script>

<style scoped>
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  flex-direction: column;
}
text {
  font-size: 24px;
  color: #333;
}
</style>

这个404.vue组件简单地显示了一个“页面未找到”的消息。当用户访问一个不存在的页面时，他们应该会看到这个消息，前提是pages.json中的onPageNotFound配置正确无误。

如果你已经按照上述方式配置了pages.json和404页面，但仍然遇到重定向没有反应的问题，请检查以下几点：

• 确保pages.json文件的格式正确，没有语法错误。
• 确保404页面路径正确无误，并且404页面组件文件存在且有效。
• 清除项目的缓存并重新编译运行，以确保配置生效。