Vue.js を使うときに気を付けること。

とりあえず、今の時点で痛い目にあったもの。

文字列の表示は .nodeValue を使っているので改行が無くなる。

<div>{{text}}</div>
のような場合に、this.text に改行が入っていても、その改行は無視されて一行で表示されてしまう。

.wrap { white-space:pre-wrap; word-wrap:break-word; }
のようなものを用意して
<div class="wrap">{{text}}</div>
とする。

VueRouter では同じハッシュ値だと一切何のアクションも発生しない。

各ページへのリンクを上部において、本体を下部に表示している場合に、
最新の情報にしたく更新のつもりで再度同じ <router-link> をクリックしても Vue は一切反応してくれない。
※ createdフックなどが呼ばれない、というか何も処理が動かない。

ただ、パラメータが違う場合は、beforeRouteUpdate フックが呼ばれるようなので、
面倒だがクリック毎に変化するダミーを用意してこのフックで捕捉して処理する。

v-for で回す場合の key は当然、重複してはいけない。

<div v-for="x of [0,1,2,3]" :key="1">{{x}}</div>
↑ みたいに key が重複すると以下のような warn がでる。
[Vue warn]: Duplicate keys detected: '1'. This may cause an update error.