Vue项目中的views和components文件夹有什么区别？

首先，两个文件夹 src/components 和 src/views 都包含 Vue 组件。

关键区别在于一些 Vue 组件充当路由的视图。

在 Vue 中处理路由时，通常使用 Vue Router，定义路由是为了切换 <router-view> 组件中使用的当前 view。这些路由通常位于 src/router/routes.js，我们可以在其中看到如下内容：

import Home from '@/views/Home.vue'
import About from '@/views/About.vue'

export default [
  {
    path: '/',
    name: 'home',
    component: Home,
  },
  {
    path: '/about',
    name: 'about',
    component: About,
  },
]

位于 src/components 下的组件不太可能在路由中使用，而位于 src/views 下的组件将被至少一个路由使用。

Vue CLI 旨在成为 Vue 生态系统的标准工具基线。它确保各种构建工具与合理的默认值一起顺利工作，因此您可以专注于编写应用程序，而不是花费数天时间与配置争吵。同时，它仍然可以灵活地调整每个工具的配置，而无需弹出。

Vue CLI 旨在快速开发 Vue.js，它使事情变得简单并提供了灵活性。它的目标是使不同技能水平的团队能够建立一个新项目并开始。

归根结底，这是一个方便和应用程序结构的问题。

有些人喜欢在 src/router 下有他们的 Views 文件夹，就像这个企业样板一样。

有些人称它为页面而不是视图。

有些人将所有组件都放在同一个文件夹下。

选择最适合您正在处理的项目的应用程序结构。

---

我认为它更像是一种约定。可重用的东西可以保存在 src/components 文件夹中 与路由器相关的东西可以保存在 src/views 中

---

一般可重复使用的视图建议放在 src/components 目录中。页眉、页脚、广告、网格或任何自定义控件（如样式文本框或按钮）等示例。可以在视图中访问一个或多个组件。

视图可以包含组件，并且视图实际上旨在通过导航 url 访问。它们通常放置在 src/views 中。

请记住，您不受限制通过 url 访问组件。您可以自由地将任何组件添加到 router.js 并访问它。但如果您打算这样做，您可以将其移动到 src/views 而不是放置在 src/components 中。

组件是类似于 asp.net 网络表单的用户控件。

它只是为了更好的维护和可读性构建你的代码。

---

这两个文件夹基本相同，因为它们都包含组件，但 Vue 的美感在于将用作页面的组件（路由到类似页面进行导航）保存在 /views 文件夹中，而保留可重用组件（如表单字段）在 /components 文件夹中。

---

src/views 通常用于您通过路由器导航的应用程序的主页。 src/components 用于您在主页中使用的可重用组件（在同一页面内或跨不同页面多次使用）

---

很简单，视图用于路由，而组件是路由的组件。

---

您可以考虑像页面和组件这样的视图是可重用的代码块，您可以在任何页面或组件中使用（两者都是 Vue 文件，这些术语仅用于演示）

---

接近静态页面的较少动态被引用到视图，而更多可重用和动态内容被放置在组件下。

---

正如其他人所提到的，这非常简单：您通常将视图用于希望用户导航的实际页面。组件是那些页面中的元素，您可以在项目的任何页面中重用它们。

---

在我看来，组件文件夹必须包含将在视图中使用的组件。在视图中，必须有路由器要访问的那些页面。例如，您的页面中有一个导航栏、页眉和页脚要使用，并且您有一个登录页面、注册页面和一个主页。然后你的 src/components 必须包含页眉、页脚和导航栏。在您的 src/views 中必须有诸如登录、注册和主文件之类的文件。

---

这两个文件夹都包含 Vue 组件，“views”文件夹应该包含将导入其他组件的根级组件。所谓的“其他组件”位于“组件”文件夹中。我们举一个例子来说明。

假设您的网站 yourname.com 有 3 个根级页面

yourname.com

yourname.com/about

yourname.com/price

您的“视图”文件夹将包含 3 个组件。 “about.vue”、“index.vue”和“price.vue”。这些文件将被导入到你的路由文件中，或者可以直接导入到 app.vue 文件中进行路由。这些视图内部可能有多个组件，例如“price-card.vue”、“contact-card.vue”等。这些文件通常位于名为“组件”的文件夹中。您可以在“views”文件夹中的 vue 文件中导入这些组件，然后渲染它们。

---

无非是按逻辑顺序安排项目。您仍然可以在视图文件夹中创建组件，但这是分隔项目的更好方法，这样代码就不那么混乱了。

---