slotに関する発見

<slot>を勉強した。slotには「名前付き」と「名前なし」がある。名前なしだと、コンポーネントを使う側でvalueを決めるけど、名前付きだとその名前を通じてslotのvalueにアクセスできる。あと、slotには範囲があって、子供のslotのデータと親のデータが同じでバッティングしてる時は親が有効。

Array.sortで配列の要素を昇順/降順に並べ替える

rl.on('close', () => {
  for (let [key, value] of prefectureDataMap) {
    value.change = value.popu15 / value.popu10;
  }
  const rankingArray = Array.from(prefectureDataMap).sort((pair1, pair2) => {
    return pair2[1].change - pair1[1].change;
  });
  console.log(rankingArray);
});

close イベントに設定した無名関数の中身を、以上のように実装します。

  

const rankingArray = Array.from(prefectureDataMap).sort((pair1, pair2) => {
  return pair2[1].change - pair1[1].change;
});

まず Array.from(prefectureDataMap) の部分で、連想配列を普通の配列に変換する処理をおこなっています。

更に、Array の sort 関数を呼んで無名関数を渡しています。
sort に対して渡すこの関数は比較関数と言い、これによって並び替えをするルールを決めることができます。

比較関数は 2 つの引数を受けとって、
前者の引数 pair1 を 後者の引数 pair2 より前にしたいときは、負の整数、
pair2 を pair1 より前にしたいときは、正の整数、
pair1 と pair2 の並びをそのままにしたいときは 0 を返す必要があります。
ここでは変化率の降順に並び替えを行いたいので、 pair2 が pair1 より大きかった場合、pair2 を pair1 より前にする必要があります。

Nuxtの動的URL

URLが動的に変わる場合、pagesのファイル名は「_hogehoge.vue」のように先頭に「_」アンダーバーをつける。

こうすることで_をつけたディレクトリやファイルがルートのパラメータとして扱えるようになる。

 

プラグインを使うときはインストールしてpluginsに記述することで使えるようになる。