element-ui+vue2笔记

创建一个vue项目：

vue create component-demo

 

 

 

 此时CMD窗口可以关闭了

用Idea打开项目

.md 文件的写法

# 一级标题
## 二级标题
### 三级标题

```
引用
```

目录结构：

 里面有个 node_modules 文件夹没有显示出来

components目录下有个HelloWorld.vue，同理，我们可以在这里写其他的vue文件

App.vue是一个根组件，我们先看这个文件

在App.vue文件内使用模块的步骤：

 当然，你也可以在Movie.vue文件里面用这招👆

element-ui:

npm i element-ui ：i是 install 安装的简写

下载好后，源码放在 node_modules 文件夹里

还会在 package.json 里面留下记录

从网上下载项目后不会包含 node_modules 文件夹，在项目路径下运行：

npm i ：会自动下载 node_modules 下所需的源码

在main.js文件里：

 

使用第三方图标库：

网站：Font Awesome，一套绝佳的图标字体库和CSS框架 (dashgame.com)

1.下载安装

npm i font-awesome ：安装 

2.在main.js里面导入：

 Axios：

1.安装

npm i axios

Axios是基于Ajax的异步请求框架的增强框架

main.js是最全局的，我们首先看它

前端用node服务器运行的8080端口，后端用SpringBoot的TomCat服务器运行的8081端口，即使前端去8081端口拿数据，也会出现跨域问题，Controller类添加@CrossOrigin注解可以有效解决此问题

后端数据Axios发送给前端后出现此问题：

caught (in promise) TypeError: Cannot set properties of undefined (setting 'tableData')
    at eval (Hello.vue:75:1)

我们可用使用箭头函数避免此类问题的发生：

 

 

 vueRouter是vue提供的一个官网插件vueRouter3对应vue2