时间戳

首页 > 解决方案 > 我的头文件应该从 Nuxt 中的“store”文件夹而不是“components”文件夹中调用吗？

vue.js - 我的头文件应该从 Nuxt 中的“store”文件夹而不是“components”文件夹中调用吗？

问题描述

我正在测试 Nuxt 中的 Vuex 存储实现，并想知道 Store 文件夹现在是否是共享组件和模块的最佳方式，而不是使用 Components 文件夹？

例如，我目前从 Layouts 文件夹中的 default.vue 调用标头，此代码引用了 Components 文件夹：

<template>
  <div class="container">
    <Header />
    <nuxt />
    <Footer />
  </div>
</template>

<script>
import Header from '~/components/appheader.vue'
import Footer from '~/components/appfooter.vue'
export default {
  components: { Header, Footer }
}
</script>

但是，据我了解，如果 header.vue 在 Store 文件夹中，则可以简单地使用文件名调用它，如下所示，无需导入或导出它。我理解正确吗？

<template>
  <div class="container">
    <appheader></appheader>
    <nuxt />
    <appfooter></appheader>
  </div>
</template>

标签： vue.jsmodulevuexnuxt.js

解决方案

不，商店文件夹不应包含组件。仅将您的组件放在components文件夹中。

该store文件夹仅用于模块化 Vuex。

如果您不想import在每个组件中编写语句，可以使用nuxt-global-base-components。但我不相信这是一个好习惯......

另外，请注意您的组件名称。页眉和页脚是 html 保留字。将它们命名为 AppHeader 和 AppFooter。

推荐阅读