102-尚硅谷-尚医通-前台用户系统-目录结构和封装axios

下面呢，给大家介绍一下纳搭建环境之后，它相关的目录结构到底是怎么样的，那这里边我们来一起看一下啊，它有哪些物流结构。也就是里边有哪些文件和文件夹，那各位看，首先在里边的有第一个文件夹叫点na，这是里边一些相关的编译之后的一些文件，这个文件目录我们不需要变，然后第二个叫a set，这是什么呢？在这里边的一边咱们放一些静态资源，比如说放一些CSS文件，JS文件，图片文件等等。第三个叫common，就是放里边一些相关的组件，就voe知识的一些组件，然后下面有一个叫layout，还有一个叫pages，这点很重要，一会给大家来说等先说下面的啊，就是下面有这些文件，比如这个middle，什么where，包括里边有sides，什么to等等，也是放一些相关的静态资源，还有一个叫放一些它依赖的插件等等。

所以这是nat中的目录结构，然后除了这个之外呢，这里边有两个很重要，一个叫layout，一个叫配置词，那我下面呢，把这两目录给大家特别说一下，一个layout，一个配置词，那我写一下。Layout，还有一个叫配S，然后咱们首先看这个layoutout什么意思呢？它就表示这里边我们要写上一些页面，用于设置你页面中一些相关的布局，还有一个叫配S，就你页面中那些内容的一些页面，这是两个文件夹的一个说明，一个layout，一个叫配S。然后咱们看一下这个layoutt，在layout里边呢，有vuee文件，在配置S中u vuee文件。那它们是一个什么样的结构呢？给大家说一下，首先我们说一下什么叫页面布局，也就是说我这个网页中啊，它显示了一个位置，就是每部分到底显示什么。

比如说咱现在有一个网页，假如说我现在啊，在网页的上边显示它的头部分，包含它的logo啊，包含它的标题名称等等，然后在尾部分显示它的比如什么版权信息，联系我们等等，中间部分呢，是它那些具体内容，而这个结构我们就在这个layout里边做一个定义啊，这是我们一个说明，然后layout中这是头，这是尾，中间部分强调啊，就是中间部分内容的并不是在这个料中定义，咱们要引入其他页面，在这里边用到一个标签，这标签叫na，在na中呢，引入其他页面，而其他的页面就是在配置四里面做了定义。咱把这页面又给它引入到这里面来。

所以这个啊，是它里边的这么一个结构，我再说一遍啊，也就是说咱们现在在进行页面访问的时候，首先先进入到是你这个layout这个文件夹中那个布局页面。然后布局页面中显示它的这个头信息，显示它这个尾信息，包括中间内容，而中间内种并不是在布局页面中进行定义，而它是要引入其他页面，这个其他页面是在配置里面定好的，所以这是它的一个结构，也就是大家看到我们刚才这个水面中，就是它里边首先进入到不绝面。然后通过布局页面到配置组页面，它默认布局页面叫default，这里边的inext布E就是里边这个首页面中那种，包括大家看首页面中，你看就有一个简单这么一个图标的一个显示，应该没有其他部分。所以这个啊，就是关于我们对于这些文件夹的一个说明，各位把它要知道这个我们就说到了啊，特别是刚才说这个layout和pages，你要知道它这个加载特点，首先进入到布局页面，然后在布局页面中要引入其他的页面中内容。

所以这个我们就说完了，然后这个说完之后呢，咱去往下走啊，下面呢，我们在这个就是框架中，咱封装一个叫AXFS，用于一会儿的阿贾克斯启动操作，而这个封装呢，我们强调之前咱们写这个后台管理系统中，里边已经帮咱们做了封装，而目前里面没有，所以咱们需要自己封装，而封装过程其实也是参考之前做法，跟之前是类似的，那下面给大家就快速封装一下。首先第一步我在里边呢，比如说我建工件夹，我叫U。然后在里边呢，建一个文件。

我教这个蕊快点JX，在蕊快点X中，咱就写上里边这个相关这些内容，我把内容给它叫写过来，也就是里边的这部分我先写过来，然后我来说明这段话什么意思，就是之前咱都见过啊，就是首先我们引入AXLX，这个咱一会儿需要下载下来，然后第二个引入IUY，用一些消息的输出，这位置就是创建它的对象，这是我们的那个IP通号，这是它的超时时间，然后下面有它的request的拦截器，还有response拦截器，用一些其操作单请求中做一些处理。咱们想中，这是它的法律内容。所以这样的话呢，把这个我们就写出来了，然后写完之后，咱们需要把这个AXFX这个插件它要下载下来，那我在里边做下载。用到我们这个命令，N PM in store AX iOS，那我现在直接回车，咱来下载一下，下载之后这个就完成了封装，后面我们再写代码，跟之前的管理员系统中的写法基本上保持一致，然后也是写这JS文件定义接口，然后在页面中自调用。

所以现在这个封装我们就完成了。也就是说到这里为止呢，咱把这个用NAS的搭建咱们的用户系统的前端环境这些过程应该就说完了，所以各位能按照我刚才说的过程，把这个环境能给他准确的搭建出来。那比如说刚才我这里边忘了新的内容，咱把服务器再重新启动一下，看它能不能正常启动，如果能正常启动，这它安装都是正确的。那我们给它启动一下啊。然后各位看目前应该没有问题，然后到里面刷新，这个也可以访问，所以现在环境咱们就完成搭建，然后搭建环境之后呢，一会儿咱们在首页面中来完成咱们的预约挂号平台中的首页数据显示，包括编写接口，包括整个页面。