VUE的深坑（一）

不念不忘少年蓝@ 2022-09-01 13:59 111阅读 0赞

## 框架的下载 ##

[vue框架下载][vue]  
在使用vue之前必须先下载node.js。不然依赖包都是下载不了的。

## 先了解目录结构 ##

![在这里插入图片描述][b233ed7491244172a35a979541e6a8ef.jpg]

目录结构是必须先掌握的，不同的版本对应的不同的目录结构，不过都是大同小异的。还不太了解可以去[菜鸟教程][Link 1]查看。  
我个人的目录是少了一些配置文件的，所以之后还需要再添加进去。

## 运行 ##

一般运行命令都是下面这个，如果需要修改的话可以找到package.json中"scripts"修改

npm run serve

## Vue的基础操作 ##

> 写代码的地方都是在src这个目录中

1.  我们需要全局引包的话可以在main.js中将第三方包通过代码引入

引入
    import axios from 'axios';
    通过挂载在原型上，以后在任何的页面里面都可以使用变量$axios进行使用
    Vue.prototype.$axios = axios;

2.vue的主体框架都是App.vue这个文件。这个文件写的代码基本上是组件的名字。需要用组件就先引入之后再使用就可以了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dvcmszMw_size_16_color_FFFFFF_t_70]

1.  Vue的组件都装在了components这个大文件中，你可以在这个文件继续新建文件夹来标识不同的组件，只不过通过import引入的时候要写完整路径。

> 基本的使用就是  
> 1.先下载框架  
> 2.build  
> 3.编写组件赢并引用。

[vue]: https://cn.vuejs.org/
[b233ed7491244172a35a979541e6a8ef.jpg]: /images/20220829/22aca2b0e32b44faa453584840714a47.png
[Link 1]: https://www.runoob.com/vue2/vue-directory-structure.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dvcmszMw_size_16_color_FFFFFF_t_70]: /images/20220829/9d8032c6f7794933af1890dfc94139e1.png

发表评论取消回复

表情：

评论列表（有 0 条评论，111人围观）

还没有评论，来说两句吧...

相关阅读

相关记录一次RuoYi-Vue的坑

Invalid bound statement (not found): com.ruoyi.system.mapper.SysConfigMapper.selectConfi

柔光的暖阳◎/ 2023年10月08日 17:54/ 0 赞/ 7 阅读

相关北湖深坑 | 感受算法的魅力

> 5. 北湖深坑 > > <table> > <tbody> > <tr> > <td>成绩</td> > <td>10</td> >

今天药忘吃喽~/ 2022年12月04日 09:26/ 0 赞/ 148 阅读

相关 golang 深坑 concurrent map writes

golang map 真的是深坑，PHP中直接写入没问题，GOLANG和PHP不一样，必须加锁。 package main import (

比眉伴天荒/ 2022年10月06日 00:38/ 0 赞/ 135 阅读

相关【vue】vue深拷贝

vue 深拷贝方式1 测试 let param = JSON.parse(JSON.stringify(this.$route.params))

绝地灬酷狼/ 2022年09月08日 05:55/ 0 赞/ 152 阅读

相关 VUE的深坑（一）

框架的下载 [vue框架下载][vue] 在使用vue之前必须先下载node.js。不然依赖包都是下载不了的。先了解目录结构 ![在这里插入图片描述][b2

不念不忘少年蓝@/ 2022年09月01日 13:59/ 0 赞/ 112 阅读

相关 Nodejs中“循环+异步” 好深的坑！！

这几天在搞Nodejs从数据库中获取数据进行格式转换，折腾了好几个日日夜夜，各种循环+异步操作，最后发现这玩意好恶心，怎么每次运行结果都会变，有时报错哪个值undefined有

一时失言乱红尘/ 2022年07月13日 13:24/ 0 赞/ 228 阅读

相关 vue的坑

1. 路由变化页面数据不刷新问题 2. setTimeout/setInterval(泛指异步回掉函数的this指向)this指向改变，无法用this访问VUe实例 3.

r囧r小猫/ 2022年05月22日 08:48/ 0 赞/ 190 阅读

相关 Vue学习笔记——Vue的坑

1、v-for的坑： vue低版本中 data里面的items和computed里面可以一样，但是高版本，是不允许相同名称。 2、\{ \{\}\}和v-text

小灰灰/ 2022年05月19日 02:52/ 0 赞/ 169 阅读

相关 Vue入坑篇（一） --详细

一.什么是Vue.js? 1. 前端三大流行框架： Vue.js Angular.js React.js 2.Vue.js是目前最火的前端框架，React.js是最

￡神魔★判官ぃ/ 2022年04月23日 16:50/ 0 赞/ 182 阅读

相关 vue 过渡的坑

说一下自己使用vue过渡时爬的坑第一 <transition v-for=" " key=" " @before-enter="beforeEnter" @enter="

向右看齐/ 2021年12月23日 00:41/ 0 赞/ 216 阅读