Quantcast
Channel: Challenge Engineer Life !
Viewing all articles
Browse latest Browse all 134

Vue.jsのComponentsで2個目以降のコンポーネントが表示されない

$
0
0

最近Vue.jsで趣味アプリを作ってます。で、コンポーネントを使ってみようとapp.jsに以下の定義を入れました。

Vue.component("mycomp", {
  props: ["comp"],
  template: "<div>僕のコンポーネント</div>"});

htmlは単純に次のように書きました。

<mycompid="1" /><mycompid="2" /><mycompid="3" />

すると、なぜか1個しか表示されない orz

f:id:kikutaro777:20180314214214p:plain

タグの後ろに普通のHTMLタグを置いても何も表示されず、最初のコンポーネント配置以降に何らか問題があるようです。
なにこれ、JavaScriptわからないよー、と思いながらググったら全く同じ質問がありました。さすがStackOveflow!

stackoverflow.com

明示的に終了タグを書かないといけないようです。

書き換えたら

<mycompid="1"></mycomp><mycompid="2"></mycomp><mycompid="3"></mycomp>

出たー!

f:id:kikutaro777:20180314214945p:plain

以上です。


Viewing all articles
Browse latest Browse all 134

Trending Articles