ホームページ > 記事 > ウェブフロントエンド > 初心者のための VueJs VueJs パート コンポーネントの作成、インポート、および使用
コンポーネントとは何ですか?
コンポーネントは、Vue アプリケーションの構成要素です。各コンポーネントには独自の機能とビューがあり、コンポーネントはアプリケーション全体で再利用できます。コンポーネントの一例は、さまざまなページからアクセスできるナビゲーションバーです。
基本コンポーネントの作成
コンポーネント フォルダーに HelloWorld.vue という名前の新しいコンポーネント ファイルを作成します (必要に応じてファイル名は変更できます) (コンポーネント フォルダーがまだ存在しない場合は、新しいコンポーネント フォルダーを作成します)。
HelloWorld コンポーネント:
<template> <div> <h1>Hello, World!</h1> </div> </template> <script> export default { name: 'HelloWorld' } </script> <style scoped> h1 { color: blue; } </style>
<template> <div id="app"> <HelloWorld /> </div> </template> <script> import HelloWorld from './components/HelloWorld.vue'; //adjust according to the path to your component export default { components: { HelloWorld } } </script>
これで、App.vue コンポーネントでレンダリングされた HelloWorld コンポーネントが表示されるはずです。
以上が初心者のための VueJs VueJs パート コンポーネントの作成、インポート、および使用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。