2019年12月24日，人生中的第一份实习。实习的公司虽然不大，但是团队氛围很好，带我的前辈们也特别好，真的非常感谢他们对我的帮助。实习过程中前辈给的建议：养成做技术总结文档的习惯。重视编程思想和底层技术。开发人员以后的职业出路可以是：资深工程师、创业、管理层（但是不能丢技术）。如果只做前端以后的职业发展会受限，我可以先从前端切入，前后端都要学习，以后才能成长为成架构师，然后就是保持终身学习的思想。
| 第一份实习过程中遇到的问题及解决方法 —— vue 前端实习生 | ||
|---|---|---|
| ***** | Element UI 在实际项目开发中用到的很多，传送门。如果有时间的话最好学习一下小程序。 | |
| 1 | vue 项目来发前最好新建一个代码风格配置文件：.editorconfig，该文件也可直接导入到已有项目，导入之后，如果项目之前代码不规范，可以通过：ctrl+alt+l 进行格式化。vue 项目给路径配置别名、统一代码风格配置 | |
| 2 | 项目的文件路径用首字母小写的驼峰命名，比如：src/views/home/childComps。 . vue组件文件用首字母大写的驼峰命名法。 | |
| 3 | 项目中的静态资源，比如 css 样式和 img 图片，最好在 src 下新建 css 和 img 文件夹来存放，css 和 img 文件夹下可以针对不同组件新建子文件夹，存放指定组件的 css 和 img 资源，这样做的目的是使项目目录更加清晰，方便后期资源查找和项目维护。 | |
| 4 | vue.config.js 配置文件的端口号和域名，自己改的不要往上 git 代码托管工具上提。 | |
| 5 | vue项目中的 vue.config.js 配置文件，在修改之后需要重启服务 npm run serve。启动服务可以到 webStorm 编译器进行 npm 简单配置，+ npm serve。这样就不用每次重启服务都手动 npm run serve 了，可以直接一键运行。 | |
| 6 | 不确定后台服务是否启动时，可以通过 Win + R cmd 命令行：ping 域名+端口，可以判断是否联通。 | |
| 7 | 用 git 在 push 项目之前，先拉一下 ↙ 最新的代码，然后 √ ，直接 commit 即可（看到不想提交的文件，比如 vue.config.js 配置文件一般不提交，可以直接右键 revert 或删除）。commit 之后再 git push 即可，如果没有进行全局配置，则右键项目 git push，或 ctrl+shift+K。 | |
| 8 | VueRouter 的两种模式，hash 模式和 history 模式，history 模式下的 url 路径没有 # 号。修改模式的方法是在 VueRouter 的实例下写上如下代码：mode：'history' 或 mode：'hash'。这两种模式的区别：传送门 | |
| 9 | 关于 git 克隆远程分支的问题：传送门 | git 中 checkout 分支、tagname 的时候，不需要全写名，按 Tab 键可以自动补全。 |
| 10 | 如果想清空命令行里的信息,可以执行 cls 命令,即输入 cls 回车 | |
| 11 | Element UI 里的表格多选框，有一个 selectable 属性，仅对 type=selection 的列有效，类型为 Function，Function 的返回值用来决定这一行的 CheckBox 是否可以勾选。Function(row, index) | |
| 12 | Element UI 官网的 Table 表格中提到：通过 Scoped slot 可以获取到 row, column, $index 和 store（table 内部的状态管理）的数据，我们可以理解为：tableData 是给到 table 的数据集合，scope 是 table 内部基于 tableData 生成出来的数据表格，我们传进去的 tableData ，在 table 内部生成了类似于 Excel 的 scope，因此，通过scope.row.date，我们就可以读取到每一行中的date。<el-table :data="tableData" style="width: 100%"><el-table-column label="日期" width="180"><template slot-scope="scope"> <!--template自定义渲染--><span style="margin-left: 10px">{{ scope.row.date }}</span></template></el-table-column>****<el-table> ****如上述代码，可以在 <template slot-scope="scope"> 中通过 scope.row.键名，获取所在行的某一列的数据。同时可以添加点击事件，也可以使用过滤器；传送门 | |
| 13 | Array 数组还有一个 includes() 方法，使用方式：array . incudes(element) ，返回 ture/false | |
| 14 | JavaScript 日期处理类库：moment.js | |
| 15 | 使用 npm 安装依赖比较慢，可以设置 npm 为淘宝镜像：npm config set registry registry.npm.taobao.org，然后可以执行 npm config get registry 查看镜像地址，如果没问题的话会出现 "registry.npm.taobao.org"。最好装个 yarn。 | |
| 16 | vue cli 运行项目之后会抛出两个地址：Local 和 Network ，Local 地址是本地地址，只能在自己的计算机上访问。Network 地址是网络地址，和你处于同一局域网内的人可访问该地址。比如：你的同事需要访问你正在做的项目，可是你并没有部署上线，那么他就可以通过访问 Network 这个地址浏览你的项目。又或者，你正在做一个 web 移动端项目，你需要在手机上浏览效果，你打开手机浏览器输入 Network 这个地址（前提是你和电脑处于同一局域网，例如你连接了你们公司的 wifi），即可浏览。注意：生成的 Network 地址是不可改变的，因为他是你本机的 IP 地址，能改变的只有端口号。在 vue-cli 3.0 中，设置 host：0.0.0.0，则生成 Local 和 Network 网络环境。 Local：http://localhost：端口号 >例：http://localhost:8080 、Network：http://本机ip+端口号 >例：http://192.168.1.134:8090 | |
| 17 | 127.0.0.1 是回送地址，指本地机，一般用来测试使用。回送地址（127.x.x.x）是本机回送地址（Loopback Address），即主机 IP 堆栈内部的 IP 地址，主要用于网络软件测试以及本地机进程间通信。 | |
| 18 | 网站上看到中意的图片，想要拿到该图片的网址，以便自己开发使用：右键检查 → Open in new tab → 复制网址。 | |
| 19 | MAC（Media Access Control或者Medium Access Control）地址，意译为媒体访问控制，或称为物理地址、硬件地址，用来定义网络设备的位置，在 OSI 模型中，第三层网络层负责 IP 地址，第二层数据链路层则负责 MAC 地址，因此一个主机会有一个 MAC 地址，而每个网络位置会有一个专属于它的 IP 地址。MAC 地址是网卡决定的，是固定的。 | |
| 20 | 快速拿到，检查网页源码，然后复制黏贴大法好： | |
| 21 | Element UI 的分割线：传送门、2.0.11 版本没有分割线功能。 | |
| 22 | 修改 Element UI 的原始样式，需要到项目目录下的 theme/index.css 文件中查找相应的样式做修改。 | |
| 23 | 记录一下因前端路由写错一个字母调试了半天。以后尽量仔细点，不要出现这种缺失字母的问题，问题挺小的，但是很难排查。 | |
| 24 | element ui el-checkbox 多选框竖向排列：在 el-checkbox 中加入样式：style=" display : block；" | |
| websocket 是一个请求与响应的常连接 *** |
