前段时间了解了一下vue-element-admin，按着官网搭建了一下，踩了不少坑，有时间就记录下来，方便以后用到了可以在看看。下面我讲的是用git克隆的方法，当然你也可以直接在github上下载。vue-element-admin一、搭建项目的前提条件1.克隆vue-element-admin需要用到git,如果没有安装git,命令会报错 (1）git下载地址：下载地址，下载比较慢 （2）下载完后直接下一步下一步安装即可 （3）安装完成后，cmd命令行输入：git-v或git--version可以查看版本,效果如下图所示：2.vue项目的话，肯定要安装搭建vue环境
场景:前端开发中,经常会遇到比较多的表单填写页面,其中有el-form,el-table,表格的每一列中又嵌套着输入框或者下拉框,然后每个还需要做单独的校验效果: 点击保存可校验el-input和el-select是否有值，不符合校验规则就标红提醒 1.el-form嵌套el-table1.el-form里面嵌套el-table2.在el-table-column自定义内容里面，嵌套el-form-item，里面再放el-input或者el-select结构3.数据的结构因为el-form是最外层的，所以formData是个对象，对象里放el-table用到的数组和rules这样定义是为了校验
场景:前端开发中,经常会遇到比较多的表单填写页面,其中有el-form,el-table,表格的每一列中又嵌套着输入框或者下拉框,然后每个还需要做单独的校验效果: 点击保存可校验el-input和el-select是否有值，不符合校验规则就标红提醒 1.el-form嵌套el-table1.el-form里面嵌套el-table2.在el-table-column自定义内容里面，嵌套el-form-item，里面再放el-input或者el-select结构3.数据的结构因为el-form是最外层的，所以formData是个对象，对象里放el-table用到的数组和rules这样定义是为了校验
selenium中有8种不错的元素定位方式，每个方式和应用场景都不一样，需要根据自己的使用情况来进行修改8种find_element元素定位方式1.id定位2.CSS定位3.XPATH定位4.name定位5.class_name定位6.Link_Text定位7.PARTIAL_LINK_TEXT定位8.TAG_NAME定位总结目前selenium已经出现了新的版本的定位方式，虽然说定位语法不一样，但是万变不离其宗。用旧版的定位语法就会出现这个删除线，你用他来进行爬虫的时候运行时就会提示你虽然问题不大但是还是得考虑使用新版本的定位方式DeprecationWarning:find_element
selenium中有8种不错的元素定位方式，每个方式和应用场景都不一样，需要根据自己的使用情况来进行修改8种find_element元素定位方式1.id定位2.CSS定位3.XPATH定位4.name定位5.class_name定位6.Link_Text定位7.PARTIAL_LINK_TEXT定位8.TAG_NAME定位总结目前selenium已经出现了新的版本的定位方式，虽然说定位语法不一样，但是万变不离其宗。用旧版的定位语法就会出现这个删除线，你用他来进行爬虫的时候运行时就会提示你虽然问题不大但是还是得考虑使用新版本的定位方式DeprecationWarning:find_element
可以简单理解为：label是给用户展示的东西，value是前端往后端传递的真实值template>div>el-page-header@back="goBack"content="注册">el-page-header>el-divider>el-divider>el-row>el-col:span="12":offset="6">el-formref="form":model="userInfo"label-width="80px">el-form-itemlabel="用户名">el-inputv-model="userInfo.username">el-input>el-form-item
可以简单理解为：label是给用户展示的东西，value是前端往后端传递的真实值template>div>el-page-header@back="goBack"content="注册">el-page-header>el-divider>el-divider>el-row>el-col:span="12":offset="6">el-formref="form":model="userInfo"label-width="80px">el-form-itemlabel="用户名">el-inputv-model="userInfo.username">el-input>el-form-item
vite创建vue3+ts项目为何选择vite：vite是一个基于Vue3单文件组件的非打包开发服务器，它做到了本地快速开发启动：快速的冷启动，不需要等待打包操作；即时的热模块更新，替换性能和模块数量的解耦让更新飞起；真正的按需编译，不再等待整个应用编译完成，这是一个巨大的改变。（平均一秒run）本文技术栈是vue3+vue-router+ts+vite+element-plus+pinia。初始化项目（1）在需要创建位置cmd目录下执行npminitvite@latest（2）输入项目名称（3）选择vue（（有时出现上下键不能选择，手动输入选项回车就行））（4）选择vue-ts（或者是选择语
vite创建vue3+ts项目为何选择vite：vite是一个基于Vue3单文件组件的非打包开发服务器，它做到了本地快速开发启动：快速的冷启动，不需要等待打包操作；即时的热模块更新，替换性能和模块数量的解耦让更新飞起；真正的按需编译，不再等待整个应用编译完成，这是一个巨大的改变。（平均一秒run）本文技术栈是vue3+vue-router+ts+vite+element-plus+pinia。初始化项目（1）在需要创建位置cmd目录下执行npminitvite@latest（2）输入项目名称（3）选择vue（（有时出现上下键不能选择，手动输入选项回车就行））（4）选择vue-ts（或者是选择语
vuex维护websocket并且进行心跳检测，断开进行重连等业务需求效果图（123张图分别为初始化连接，模拟网络断开进行重连，模拟网络恢复重新建立连接）需要连接点（维护点）一、登录调用方法vuex里index进行注册utils.js代码块，主要代码（备注会一行一行写清楚，请耐心查看）app.vue中再次调用getUserInfo方法，避免浏览器强制刷新导致断开连接页面使用（附效果图）难点在于连接成功后onopen、onmessage方法心跳检测，以及onclose、onerror断开连接后进行重连。这块还添加了自己本身的另一个短连接口业务，所以会难梳理。不懂的还请vuex里代码每行注释进行通
