m0_64785232的博客

原创 el-table数组表单，校验规则

所以我的el-table绑定的数据也要变成:data="tableFrom.form"：在上方用rules：绑定rules进行表单校验。我的rules中也应该在嵌套一个form对象。

原创 iframe标签设置高度百分比不生效，无法做成自适应问题

设置px的话在小屏幕可以正常显示，但是如果移到大屏还是600px,无法做到自适应。解决方法很简单，在style中设置iframe的高度。iframe标签设置高度百分比不生效，只能设置px，无法做成自适应问题。

原创 CSS给div一个带有圆角的渐变边框

是不行的，这样设置完以后渐变色边框虽然会显示,但是圆角不能出来，解决方法如下。2.这是个带有渐变效果的div边框，设置代码如下。3.如果想给划入加些效果也可以做升级。单纯的设置border-

原创 Vue3路由跳转携带参数查询，并调用接口

跳转过去，F12网络中调用了这个接口，负载中带有type：00的参数。进行路由跳转，进行参数携带，并调用接口，并在跳转过去的页面通过。监听（使用vue route和watch）在你跳转过去的页面中使用watch监听。

原创 el-data-picker日期组件，搭配dayjs日期库进行日期选择

上图显示两个选择框，其中触发日期只可选择日期不可选择时分秒，触发时间不能选择日期只可选择时分秒，且触发时间小于当天日期为显示类型，还可选择year（年份），week（周），month（月）.......，第二个案例讲解的用法指定绑定值的格式函数（看需求如果需要有禁用条件就写，没有的话不用写）禁用条件TruggerDate这个函数是用于判断给定的日期是否已经过了当前时间。函数接受一个Date对象作为参数，使用dayjs库获取当前日期，并与给定的日期进行比较。

原创 el-tab-pane切换组件，通过el-badge右上方显示数量

先看效果，需求做一个切换栏，并且切换栏的右上方显示数字，无数据显示0（现在为mock数据并不是真实数据，所以显示为0）这个是真实数据通过条数，显示数量常规的切换栏不需要显示数字很简单 ，通过name不同值进行切换传参，后台就可以通过传的不同name去返回对应的数据如果显示数量就需要使用插槽和el-badge 组件，并且通过computed计算属性计算是否有值，zeroNumber为下方script定义的计算属性

原创 el-dialog弹窗，显示详情的两种方法

3:这个地方需要通过watch监听一下，监听有子组件传来的id再刷新这个调用详情的方法。子组件通过props接收 （id就是父组件传过来的）就可以在template中直接使用。2:上方再通过form进行取值。

原创 逻辑思维题

【1】假设有一个池塘，里面有无穷多的水。现有2个空水壶，容积分别为5升和6升。问题是如何只用这2个水壶从池塘里取得3升的水。【2】周雯的妈妈是豫林水泥厂的化验员。 一天，周雯来到化验室做作业。做完后想出去玩。 "等等，妈妈还要考你一个题目，“她接着说，“你看这6只做化验用的玻璃杯，前面3只盛满了水，后面3只是空的。你 能只移动1只玻璃杯，就便盛满水的杯子和空杯子间隔起来 吗?” 爱动脑筋的周雯，是学校里有名的"小机灵”，她只想了一会儿就做到了。 请你想想看，"小机灵"是怎样做的?【3】三个小伙子同

原创 长度为8-16个字符，且必须包含字母、数字及符号，不区分大小写的正则校验

方法二：在rules中写三个校验分别校验。

原创 前端实现回显手机号344分隔

如果想实现3-4-4：在这里加-

原创 pnpm : 无法加载文件 C:\Users\KKwang\AppData\Roaming\npm\pnpm.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.micro

这种情况再cmd中也可以看到npm和pnpm的版本，但是安装的时候就会提示报错。解决办法：开始找到：Windowspowershell（以管理员身份打开）

原创 Vue学习文档

原创 CSS高度塌陷解决方法

弊端：oveflow:hidden;的本意是超出隱藏，如果将来这个子盒子里。2•在塌陷的盒子最后面创建一个空标签，写一个行内样式：做一下清除浮动即可。1. 给塌了的元素写oveflow:hidden;弊端：创建了空标签了，造成标签过多，代码冗余。

原创 当下拉数据只有一条数据时，页面打开后默认选中

实现思路：判断返回的数组是不是只有一条，如果只有一条的话给这个值进行赋值

原创 VueMap获取到坐标后的，Json与二维数组之间的转换

二维数组比如：[[87.241659,44.03243],[88.255382,43.978562],[88.374267,43.607658],[87.918479,43.733022]]在Amap中拿到这个坐标在点击提交按钮的时候通过 ：JSON.stringify 方法将某个对象转换成 JSON。在渲染的时候再将返回来的数据通过转换二维数组，在地图上显示。

原创 联系电话实现前3和后4位显示，中间部分为*号隐藏

原创 element使用el-table和el-popover结合使用，实现鼠标移入标题栏显示气泡卡片

实现思路：使用插槽：可以通过标记顺序来看,可以忽略序号1上方的代码（这边我是根据需求，进行了一个文字通过状态值进行了显示判断）

原创 使用若依框架element-table样式以及插槽使用

我这边的v-if和else是判断如果有这个日期字段，我的页面显示返回来的字段，否则页面显示--（根据项目需求进行判断即可）可以使用Table中的：fomat。外层使用el-table组件 v-loading=loading（在script中定义const loading = ref(true)）在el-table-column中加入： :formatter="formatter。使用el-table包裹el-table-column（每一列）为内置方法，这边我只需要年月日所以是“加上HH：mm：ss。

原创 修改VsCode快捷指令

由于我这个电脑shift alt a 理应在vscode中是块注释 ctrl+/ 是行注释 但是由于电脑的一些的快捷键把vscode给替代了，所以解决方法1：修改电脑快捷键 2：修改vscode快捷键。打开方式二：左上角：文件→首选项→键盘快捷方式。打开方式一：ctrl+k+s 即可打开。

原创 Git Bash指令

Git指令总结复习- 右键:git bush 可通过git - -version查看版本设置用户签名和邮箱:通过 C盘-用户-asus-.gitconfig查看git init 初始化本地库在文件夹下生成 .git目录，找不到在上面查看 隐藏文件git status :查看本地状态 如果是红色的就代表没有变化git add xxx 提交暂存区git rm - -cached xxx:删除暂存区git commit -m :提交本地库git reflog:查看版本信息git log:查看详细版本

原创 数组截取slice方法项目使用

情景：如果有个服务需求需要在输入框输入一个人的手机号/身份证号，通过点击一个按钮让按钮下的一个输入框获取到sfz的后6为（例如重置密码功能，上方输入身份证号，下方点击重置按钮，然后默认身份证后六位）six = sfz && sfz.slice(12,18):后六位所以裁的是12-18位。定义一个six因为slice方法只能对string生效，所以是string类型。这里我没写校验规则，只写了长度限制，如果想写sfz校验规则可自行搜索一下。然后把six的值赋给 密码的字段 password时密码的字段名。

原创 前后端联调如何查看自己的地址和ping对方的地址

第一步：打开cmd小黑框输入：ping 对方地址（地址这里不要加http://）直接输入对方主机地址如下：如果看到接受100%则代表ping成功了，如果丢失100%则代表没有ping通。

原创 git修改name用户名

2：输入神秘代码：git config --list（这里可以看到用户名和用户邮箱）useremail和username。git config --global --replace-all user.email “输入你的邮箱”git config --global --replace-all user.name “输入你的用户名”git config --global user.name “输入你的用户名”git config --global user.email “输入你的邮箱”

原创 更改git的name用户名

去了公司，如果给了你一台旧电脑如何将自己的git登录到新电脑，如何移除上任使用者的用户身份？1：在电脑左下角的搜索中直接搜索：凭据管理器（或者打开控制面板——用户账户——凭证管理器）3：在下方找到普通凭证，找到git将gitee地址更改为自己的账号密码。2：点击Windows凭证。

原创 手机号以及区号的正则判断方法

const mobileReg =/^(([1][3,4,5,7,8,9]\d{9})|([0]\d{10,11})|(\d{7,8})|(\d{4}|\d{3})-(\d{7,8}))$/ const phoneReg = /^\d{3}-\d{8}|\d{4}-\d{7}$/