diwao日記diwao日記Web、ガジェット、仙台のお話Vue.jsのチュートリアルを進めていたらcomponentのところでハマった話2017.06.22ここ最近管理画面系のサイトを作ることが多く、そろそろフレームワークでも導入したいなという気持ちが高まってまいりました。ReactやAngularをバリバリ使いこなせたら素敵だなと思いつつも、実際にそれらが必要になるほど大規模な開発ってあまりないんですよね。簡易的なもので事足りちゃう。いうわけでVue.jsのお勉強を始めたのですが、しょっぱなのチュートリアルで詰まったところがあったので、同じような境遇に陥った人のため、そして自分自身のメモのために解決方法を書いておこうと思います。ハマったところVue.jsを勉強し始めた人が最初に出会うであろう公式サイトのチュートリアル、はじめにの「コンポーネントによる構成」のところ。todo</li>'});とやってもVue.jsによるレンダリングが行われない......。consoleにエラーも出ないので原因が分からずしばらくハマりました。解決方法なんでだろうなと思ったら公式サイトのコンポーネントの項目に理由が書いてありました。して親のインスタンスのテンプレートで使用できます。インスタンスをインスタンス化する前に登録されているか確認してください。Vue.jsここに書いてある通り、コンポーネントを使うためには、その親をVueインスタンス化しておく必要があったみたいです。<todo-item></todo-item></ol>jsにインスタンス化する処理を追記します。'#list'});これでVueのコンポーネントが動くようになりました!それにしてもVue.jsは日本語のドキュメントがあっていいですね。サイトも見やすいしとっつきやすい。引き続きチュートリアル進めて何か作ってみるところまでやってみたいと思います。記事一覧へ戻るAuthordiwao仙台でフロントエンドエンジニアをやっているインターネット大好きマン©diwao。