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

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

在Vue中(通常是Vue Router)处理路由时,将定义路由以切换组件中使用的当前视图<router-view>。这些路线通常位于src/router/routes.js

位于下方的组件src/components不太可能在一条路线中使用,而位于下方的组件src/views将被至少一条路线使用。

我认为这更多是一种惯例。可重用的内容可以保存在src / components文件夹中,与路由器绑定的内容可以保存在src / views中。

通常建议将可重用的视图放置在src/components目录中。诸如页眉,页脚,广告,网格或任何自定义控件之类的示例,如样式化的文本框或按钮。可以在视图内部访问一个或多个组件。

一个视图可以具有一个或多个组件,并且一个视图实际上打算由导航URL访问。它们通常放置在中src/views

请记住,您不受限制通过url访问组件。您可以随意将任何组件添加到中,router.js也可以对其进行访问。但是,如果您打算这样做,可以将其移至src/views而不是将其放置在中src/components

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

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

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

Vue CLI中views和components文件夹的区别的更多相关文章

  1. python中的包和文件夹的区别

    python的模块,就不得不说包(package),package是module的集合,在一个package中有很多的module, 还是以之前的index.py与baiduHq.py模块为案例,说明 ...

  2. taro 在components文件夹中 新建组件时,组件支持自定义命名,但是不能大写开头

    在components文件夹中 新建组件时,组件支持自定义命名,但是不能大写开头.否则会报错 错误写法: // 真实路径 import MinaMask from '../../components/ ...

  3. vue-cli中自定义路径别名 assets和static文件夹的区别

    转自:vue-cli中自定义路径别名 assets和static文件夹的区别 静态资源处理: assets和static文件夹的区别 相信有很多人知道vue-cli有两个放置静态资源的地方,分别是sr ...

  4. win10 删除资源管理器中的6个文件夹

    细心的朋友会发现,在Win10此电脑(计算机)中,除了我们最熟悉的磁盘外,还新增了视频.图片.文档.下载.音乐.桌面这6个文件夹.不少网友举觉得这6个文件夹其实并没什么用,想要去除删掉.那么Win10 ...

  5. 解决VS2010中产生的ipch文件夹和sdf文件

    纯粹参考他人博文,转载时注明参考链接!!! 参考链接: http://blog.sina.com.cn/s/blog_707a4cbf0100r5jq.html 在VS2010开发的项目中,ipch文 ...

  6. JAVA中比较两个文件夹不同的方法

    JAVA中比较两个文件夹不同的方法,可以通过两步来完成,首先遍历获取到文件夹下的所有文件夹和文件,再通过文件路径和文件的MD5值来判断文件的异同.具体例子如下: public class TestFo ...

  7. 在存放源程序的文件夹中建立一个子文件夹 myPackage。例如,在“D:\java”文件夹之中创建一个与包同名的子文件夹 myPackage(D:\java\myPackage)。在 myPackage 包中创建一个YMD类,该类具有计算今年的年份、可以输出一个带有年月日的字符串的功能。设计程序SY31.java,给定某人姓名和出生日期,计算该人年龄,并输出该人姓名、年龄、出生日期。程序使用YM

    题目补充: 在存放源程序的文件夹中建立一个子文件夹 myPackage.例如,在“D:\java”文件夹之中创建一个与包同名的子文件夹 myPackage(D:\java\myPackage).在 m ...

  8. Unity中一键创建常用文件夹

    Unity中一键创建常用文件夹 说明 项目测试版本Unity5.3. 这个一个小工具:功能非常简单,就是一键给新建工程添加所有文件夹.到此结束. 但是具体咋操作呢? 与把大象装进冰箱一样,三步,下载代 ...

  9. Unity中所有特殊的文件夹

    1. 隐藏文件夹以.开头的文件夹会被Unity忽略.在这种文件夹中的资源不会被导入,脚本不会被编译.也不会出现在Project视图中.2. Standard Assets在这个文件夹中的脚本最先被编译 ...

  10. 【问题解决方案】Linux中进入目录下文件夹

    win系统中直接 cd+空格+文件夹名 Linux下 cd+空格+./+文件名 其中句点表示"当前目录" 除非在根目录不加,或者把路径写全用绝对路径进入 Linux下切换路径的相关 ...

随机推荐

  1. OData – OData vs GraphQL

    GraphQL 很火, 很厉害, 但是它和 OData 有本质的区别. 所以并不是说任何一样对比另一个绝对的好. GraphQL is not OData twitter 的讨论 有几个点是我能 Ge ...

  2. C++ STL deque容器

    deque 容器 deque (读作deck)是"doble-ended-queue"的缩写,和vector一样都是STL的容器 deque是双端数组,而vector是单端 单端与 ...

  3. 初步认识uboot

    1. uboot下载地址 ftp://ftp.denx.de/pub/u-boot/

  4. LeetCode 650. 2 Keys Keyboard(只有两个键的键盘)(DP/质因数分解)

    最初在一个记事本上只有一个字符 'A'.你每次可以对这个记事本进行两种操作: Copy All (复制全部) : 你可以复制这个记事本中的所有字符(部分的复制是不允许的). Paste (粘贴) : ...

  5. element设置table某个列的样式

    <el-table style="width: 100%;" height="250" :data="tableData" borde ...

  6. These dependencies were not found: * core-js/modules/es.array.push.js in ./node_modules/@babel/runtime/helpers/esm/regeneratorRuntime.js

    yarn add core-js  安装core-js包 : 出现这个问题的原因:因为vue-admin-template的package.json里没写这个包core-js,然后再咱们yarn装包的 ...

  7. 一、Spring Boot集成Spring Security专栏

    一.Spring Boot集成Spring Security专栏 一.Spring Boot集成Spring Security之自动装配 二.实现功能及软件版本说明 使用Spring Boot集成Sp ...

  8. .NET高级调试 - 3.7对象检查

    简介 在大多数调试会话中,首先需要检查的项目就是分析应用程序的状态.在确认程序的问题是某种无效状态造成的,我们便需要分析程序是如何变成无效状态的.那么在分析过程中,需要为我们深入了解对象的各种审查方法 ...

  9. Android复习(三)清单文件中的元素

    <action> 向 Intent 过滤器添加操作. <activity> 声明 Activity 组件. <activity-alias> 声明 Activity ...

  10. Kafka原理剖析之「Purgatory(炼狱 | 时间轮)」

    一.前言 本文介绍一下Kafka赫赫有名的组件Purgatory,相信做Kafka的朋友或多或少都对其有一定的了解,至少是听过它的名字.那它的作用是什么呢,用来解决什么问题呢?官网confluent早 ...