Nuxt.js: How to use the same page with different URLs and switch the components to be displayed according to the URL

I want to implement the following in Nuxt.js:

1.Use the same page with different URLs.
Specifically, I want to use /pages/users/_userId.vue with/users/{userId}, /users/{userId}/follow and /users/{userId}/follower.

I examined this and there were the following issues.
- https://github.com/nuxt/nuxt.js/issues/2693
But it was a little different from what I wanted to achieve.
I want to use the pass parameter for the query parameter.

2.Identify the components to display by path parameters
It would be quicker to have a look at the code here.

・/pages/users/_userId.vue`

<template>
  <div class="user">
    <div class="user__contents">
      <div class="user__contents__main">
        <UserInfo/>
        <PostSection/> -> use if URL /users /{userId}
        <FollowSection/> -> use if URL /users/{userId}/follow
        <FollowerSection/> -> use if URL /users/{userId}/follower
      </div>
    </div>
  </div>
</template>

<script>
import UserInfo from '~/components/organisms/users/UserInfo'
import PostsSection from '~/components/organisms/users/PostsSection'
import FollowSection from '~/components/organisms/users/FollowSection'
import FollowerSection from '~/components/organisms/users/FollowerSection'

...

What should I do to achieve these?

from Nuxt.js: How to use the same page with different URLs and switch the components to be displayed according to the URL