nuxt.js如何實現同級目錄下建多個動態路由，並將鏈接設置.html后綴

nuxt.js中如果在同級目錄中建兩個_xxxx.vue的動態路由文件，那么頁面跳轉始終是跳的一個頁面，
如何解決這個問題呢？下面舉個栗子：

第一步：新建兩個頁面文件

 

第二步：在nuxt.config.js文件中配置兩個頁面的動態路由

  router: {
    extendRoutes(routes, resolve) {
      routes.push(
        {
          name: "pageA",
          path: "/strA-:id",
          component: resolve(__dirname, "pages/test/pageA.vue")
        },
        {
          name: "pageB",
          path: "/strB/:id",
          component: resolve(__dirname, "pages/test/pageB.vue")
        }
      );
    }
  },

 

第三步：設置點擊跳轉，然后重啟項目

<template>
    <div class="container">
        <a @click="$router.push(`/strA-${'參數id'}.html`)">去到頁面A</a>
        <a @click="$router.push(`/strB/${'參數id'}`)">去到頁面B</a>
    </div>
</template>

 

最后我們看跳轉后的鏈接效果：
頁面A：

 

頁面B：