vue cliプロジェクトのindex.htmlにNavbar vueコンポーネントを使用するには？

私は使い始めました。 Vue 2.0 cli。プロジェクトディレクトリが作成され、私のindex.htmlファイルは次のようになりました。vue cliプロジェクトのindex.htmlにNavbar vueコンポーネントを使用するには？

<body class="drawer drawer--top"> 
<header class="drawer-navbar" role="banner" id="navbar"> 
    <Navbar></Navbar> 
</header> 

<div id="app"> 
</div> 
</body>

（VueのCLIで作成された）Helloコンポーネントがdiv#appでレンダリングされます。しかし、Navbarコンポーネントをheader#navbarにレンダリングしたいと考えています。私はhttp://git.blivesta.com/drawer/プラグインをnavbarに使用しています。 'ヘッダー'以外のどこでも使用すると、navbarが壊れてしまいます。この機能を実装する方法は？

出典

2016-10-16 Shubham Sinha

私の答えはシュバハムを助けましたか？ –

Navbarコンポーネントは、アプリケーションdiv内にある必要があります。あなたは何をすべき

はHello.vueを交換するには、ルート要素はApp.vueの内部App.vue

ような何かをしていると呼ばれてきている。そして、

<header class="drawer-navbar" role="banner" id="navbar"> 
    <Navbar></Navbar> 
</header> 
<router-view></router-view>

あなたを表示するには、VUE-ルータを使用します他のルートを選択すると、表示されたすべてのページの上部にヘッダーが貼り付けられます。基本的に 'App.vue'はあなたのアプリのレイアウトファイルになります。

出典

2016-10-16 18:25:56

vue cliプロジェクトのindex.htmlにNavbar vueコンポーネントを使用するには？

答えて

関連する問題