参考コード

  • memberProfiles.js にプロフィール情報を作る。これを使ってリンクを生成する。
  • Members.vue でプロフィール情報を読み込んで、メンバー分のリンクを作成する。
/pages/memberProfiles.js
const profiles = [
  {
    id: 1,
    name: "中西",
    profile: "ラジオが好き。主にサンドリを聞いています。"
  },
  {
    id: 2,
    name: "のりピー",
    profile: "チャーシューが好き。主に料理をしています。"
  },
  {
    id: 3,
    name: "マイケルジャクソン",
    profile: "ダンスが好き。主にムーンウォークをしています。"
  },
  {
    id: 4,
    name: "クレオパトラ",
    profile: "有名。"
  }
];

export default profiles;
/pages/Members.vue
<template>
  <div>
    <h2>members</h2>
    <ul>
      <template v-for="profile in profiles">
        <li :key="profile.id">
          <router-link :to="`/member/${profile.id}`">#{{profile.id}} {{profile.name}}</router-link>
        </li>
      </template>
    </ul>
  </div>
</template>
<script>
import profiles from "./memberProfiles";
export default {
  computed: {
    profiles() {
      return profiles;
    }
  }
};
</script>