结构：放置导航栏组件（Vue / React）的位置

Question

关于Vue或React（我正在使用Vue）等框架中的组件，我有一个简短的问题：

我正在构建一个带有导航栏的相对简单的Web应用程序，该导航栏在所有页面上可见。

您将导航栏组件放在哪里？在每页上？还是仅一次在主要父页面上加载所有子组件？

Answer 1

您好，您可以从任何地方调用组件，只需要在components文件夹中的单独文件中创建组件即可。 （mycomponent.vue）

<template>
<h1>I am a component</h1>
</template>

，然后在您的视图中，您需要使用以下命令导入该组件：

import mycomponent from './mycomponent.vue'

最后，您只需要像这样在实例中声明它即可。

export default {
  components: {
    mycomponent
  },
  // ...
}

如果执行此操作，则可以在视图中使用此标签来打印h1。

<mycomponent></mycomponent>

这就像您创建自己的html标签一样。

这是非常简单的问候，希望它可以帮助您将导航栏设置为h1。