- 博客(220)
- 收藏
- 关注
RSS订阅
原创 VUE 用v-model的双向绑定原理封装弹窗组件
习惯了用父子组件传值，也尝试下v-model吧~第一种：使用v-model// 父组件<template> <div> <manage-dialog v-model="manageDialog"/> </div></template><script>import manageDialog from './manageDialog'export default { name: 'Manage',
2021-12-16 16:16:02
1375
2
原创 elementui的时间选择器的icon位置调整
// 左侧icon隐藏，右侧icon添加class<el-date-picker v-model="dateRange" type="daterange" :clearable='false' range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" ></el-date-picker>.el-range__i...
2021-12-15 13:33:31
2118
原创 git clone 报错问题 fatal: unable to access ‘https://github.com/monster1935/vue-admin.git/‘: SSL certific
$ git clone https://github.com/monster1935/vue-admin.gitCloning into 'vue-admin'...fatal: unable to access 'https://github.com/monster1935/vue-admin.git/': SSL certificate problem: unable to get local issuer certificate解决办法：把https改成git即可...
2021-12-06 13:58:59
728
1
原创 element-ui表格el-table-column使用v-if造成的表头与数据错位
现象：element-ui表格el-table-column使用v-if造成的表头与数据错位。解决办法：给每列加上key属性。扩展：当多个相同的组件并列，要给组件设置key属性。
2021-07-01 10:41:27
261
原创 vue 非必填项 单选 点击一下选中再次点击取消
<el-form-item label="标段异常状态" prop="biddingState"> <el-radio-group v-model="ruleForm.biddingState" @change="changeData"> <el-radio :label="1" @click.native.prevent="biddingStateClick(1)">暂停（暂时停止，后续有可能继续）</el-radio&g...
2021-06-29 15:11:44
482
原创 实现element-ui的表格嵌套表格
<el-table v-loading="loading" :data="tableData" :row-class-name="tableRowClassName" @expand-change="expandChange" :header-cell-style="{background:'#EBECF0'}" @selection-change="handleSelectionChange" ..
2021-06-21 13:58:19
1941
3
原创 解决nodejs打前端包时报npm ERR! code EINVALIDPACKAGENAME
解决nodejs打前端包时报npm ERR! code EINVALIDPACKAGENAME问题重现 解决方法前后端分离时，源码分为前端和后端两个文件夹，后端开发者想要看到页面，需要先将前端文件打包，再放入后端文件夹中的对应位置。问题重现在对应的前端文件夹下，直接使用npm install命令，报如下错误：npm ERR! code EINVALIDPACKAGENAMEnpm ERR! Invalid package name “_@[email protected]@..
2021-05-17 15:06:07
4203
原创 vue基于element-ui select下拉框获取value和label的值
https://www.jianshu.com/p/a2b593b15509https://blog.csdn.net/liujiebahuang/article/details/103736152
2021-03-23 16:12:35
754
1
原创 JS 比较两个数的大小；比较两个小数的大小（超好用！！！）
比较两个数的大小：整数如下:if(parseInt(xxx)>parseInt(xxxx)){}小数可以这样。if(parseFloat(xxx)>parseFloat(xxxx)){}错误写法：<script> function check() { var num1=document.form1.num1.value; var num2=document.form1.num2.value; if(num2>num1)
2021-03-10 15:57:01
6502
原创 中级前端工程师面试
你对页面进行性能优化的思路和思想是什么？页面生成过程https://zhuanlan.zhihu.com/p/257018971.HTML代码转化为DOM2.CSS代码转化成CSSOM3.结合DOM和CSSOM，生成一棵渲染树4.生成布局（layout），即将所有渲染树的所有节点进行平面合成5.将布局绘制（paint）在屏幕上6.减少 HTTP 请求（合并 CSS/JS，小于 10k 的图片 base64）7.减少 DOM 操作（可使用 ...
2021-03-09 16:10:02
245
原创 字符串截取
splice字符串截取,原数组不变// 截取“周”每周,6,09时45分59秒let a = "每周,6,09时45分59秒"console.log(a.splice(1,2)// '周'substring()用于提取字符串中介于两个指定下标之间的字符// 截取“，和号之间的”，中间的数字是可变的每月,4号,09时54分17秒let a = "每月,4号,09时54分17秒"console.log(a.substring(3,remark.length-11)）// '4'
2021-02-05 13:55:57
272
原创 vue + axios 导出Excel文件流（解决乱码问题）
https://blog.csdn.net/yujin0213/article/details/88238401
2021-02-01 17:25:27
295
原创 整数后面补4位0，若有小数不够4位其余的补0
<el-table-column label="合同金额（万元）" align="center" prop="money"> <template slot-scope="scope"> {{filterPoint(scope.row.money,4)}} </template> </el-table-column> /*处理保留4位小数的问题*/ filter...
2021-01-21 16:42:51
620
原创 单点登录（vue)
单点登录：一个账号可以在多个系统中登录举个例子：你在OA系统，想要不通过登录流程通过点击OB系统图标直接进入OB系统，这个流程就叫做单点登录你可能会有疑问？我怎么能拿到返回的数据呢？请求在OA系统里面返回结果也在那边怎么能拿到数据呢？是这样的。当OA系统的人员点击触发请求，OA通过a标签在新页面打开，我们前端能拿到地址栏的路径（带token)，进入到后台，后台帮前端做了登录的功能，后台重定向到前端页面的地址(带token)前端拿到token去做以列表的后续处理这边做都是通过tok
2021-01-08 15:43:09
6091
原创 vue upload上传，本地上传预览pdf
本以为不可能，这个文件既没有上传到服务器又没有放在本地，只是在一个数组里面，怎么取呢？把所有的不可能都变成了可能分为真假上传，真正上传的调接口浏览，没有上传的在本地浏览 URL.createObjectURL(row.raw)判断一下是本地的还是服务器的...
2020-12-24 09:39:42
1193
原创 vue 解决进入刷新就弹窗的问题
登录进入系统，只做一次弹窗，，，但是在做的过程中，出现了一个问题，就是登录需要的值是登录后接口才返回来的，每次只要刷新就弹窗，问题很困扰弹窗是根据返回的值去判断的，请求的数据每次都刷新，导致弹窗每次都弹出试过vuex,把弹窗放在登录前，都是不可以的。解决办法：加了一个标识，放在sessionStorage里面，登录成功把这个标识设置为true,点击关闭弹窗后这个标识设置为false,用两个条件去判断弹窗的显示问题...
2020-12-24 09:14:21
1503
原创 vue style三级运算符
<div v-for="(itemFirst,index) in childAccount" @click="changeIndentity(itemFirst.userName)" class="text item" :style="{'background-color': (itemFirst.userName==username ? '#F6E3CE':'#F4F4F5')}"> ...
2020-12-24 08:50:45
228
转载 弹性盒子Flex的最后一项向右对齐
https://blog.csdn.net/qq_41507093/article/details/87978176
2020-12-22 14:13:46
847
原创 前端下载excel文件等，项目纯前端实现文件下载
最简单的，有文件的地址，直接使用a标签实现下载（通用模板前端本地下载）： <a href="/user/test/xxxx.xls" download="文件名.xls">点击下载</a>但是有个情况，比如txt,png,jpg等这些浏览器支持直接打开的文件是不会执行下载任务的，而是会直接打开文件，这个时候就需要给a标签添加一个属性“download”;如果再vue项目中需要下载文件需要放在public文件夹下 需要下载的路径是相对于index.html文件路径 否则
2020-12-19 19:03:49
1038
2
原创 css上半部分自适应高度，下半部分自动填充竖向排列
把一个页面一份成2部分，上面的表单不是固定的，所以不能设置固定盖度，但是下面还需要填充满。我碰到的问题是下面没有填充满，出来补个div白色背景这与我想要的效果不一样弹性盒的功能很强大，思路就是一个大盒子包含2个小盒子，给大盒子设置成弹性盒，然后给上半部分用flex-shrink，下面用flex-grow就解决啦~~~上代码，哈哈哈哈/* 外面盒子 */.app{ height: calc(100vh - 50px); display: flex; // 重点 flex-dir..
2020-12-04 09:57:22
560
原创 js 比较日期大小（js获取当前日期，转化后比较日期大小）
小编做的项目的需求~~~~"当前时间是否在9月1日--11月15日之间（每年）"小编是这样做的skr~~ compareTime() { // 当前时间是否在9月1日--11月15日之间 let date = new Date(); let nowYear = date.getFullYear(); let day = new Date( Date.parse(date.toLocaleDateString().replace(/-/
2020-10-12 11:09:02
1025
原创 把一个数组对象push进另一个数组
小編今天在开发过程中遇到一个问题这是一个三级联动，当我点击确认按钮的时候会向后台发一个请求，然后把数据赋值。但是当我点击确认的时候报错了Cannot set property 'name' of undefined，请看下面代码图片错误代码图片：我想我已经在data数组里定义了name，为什么还会报错呢？？？我这样定义就固定了data里只能有一个对象，当返回多条的时候就会报错正确代码：要定义一个新的数组，然后push进去就可以了，，，你...
2020-09-29 11:34:56
3114
原创 React＜＞
创建react项目命令：npx create-react-app my-app进入文件夹:cd my-app启动项目:npm start（开发模式下运行）npm test(测试环境运行）npm run build(打包为生产模式）显示配置文件:不可逆的，只要显示了就没有任何方法再隐藏回去npm run eject为什么在src创建子目录？webpack只处理src的中的文件。如果不讲css和html放在src文件夹下，webpack发现不了。rea.
2020-09-12 16:20:32
29171
4
原创 beforeEach前置路由守卫 vue
路由守卫：通过这个名词显而易见就类似于古代城池钱士兵看守，你只有士兵认的通行证才能让你进入，如果不符合或者没有那么你无法进入这个城池，这也是为了安全起见。同样vue中的路由守卫也是一样的，一般用来拦截路由请求。使用场景：通常用在登录拦截，可以是全局也可以局部的。 做后台管理系统，会根据不同的用户权限展示不同的内容。主要思想：登录成功的时候存一个状态，可以放在localStorage/sessionStorage/store任意一个都可以 然后通过路由钩子判断一下，符合条件可以进入系统.
2020-09-03 11:20:55
521
原创 HTML：::before和::after伪元素的用法（两个冒号和一个冒号的区别）面试常考哦！！！
很多面试官都会问2个冒号和1个冒号的区别直接回答：2个冒号是伪元素，1个冒号是伪类::before和::after必须配合content属性来使用，content必须有值，content是用来定义插入内容的常见的伪类-----:hover,:link,:active,:target,:focus常见伪元素-------::first-letter,::first-line,::before,::after分别有什么作用呢::before和::after下特有的content，用于
2020-08-19 21:26:07
1385
原创 解决：git SSL certificate problem: self signed certificate
git config --global http.sslVerify false然后在git clone 地址
2020-08-19 09:16:00
199
原创 internal/modules/cjs/loader.js:985 启动node项目报错
在项目文件夹下删除node_modules,然后重新安装,就可以了
2020-07-20 14:50:00
4179
2
原创 vue设置网站图标favicon.ico
位置将favicon.ico放在根目录下方式一index.html<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />方式二webpack.dev.conf.jsnew HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', favicon: 'favicon.ico', // 新增
2020-07-07 12:17:16
556
原创 element 提交不触发请求--自定义校验没写返回函数。。。
这个地方小菜鸟已经超过2次坑了,呜呜呜...element+vue这是一个提交表单事件,表单里面有自定义校验,校验符合条件,控制台也没有报错,但就是不触发请求,这是为什么呢???最初我以为是方法写的问题,然而并不是,哈哈哈是因为:自定义校验中没有callback()返回函数,因为进入自定义校验没有callback()函数,,触发提交方法的时候就会一直在里面等待结果,就只能走到如下代码: this.$refs['formDeposite'].validate(valid => {}
2020-06-18 15:21:09
988
原创 element 校验开始时间小于结束时间,结束时间大于开始时间
<el-col :span="12"> <el-form-item label="期望发货时间：" prop="orderEtd"> <el-date-picker v-model="form.orderEtd" type="date" valu...
2020-05-09 10:31:39
1168
原创 a标签实现下载本地文件的功能
<a :href="detail.ctaFile" target="_blank" v-if="detail.ctaFile">点击下载</a>target=“_blank”是打开新的页面:href链接的目标
2020-04-16 18:30:44
3237
原创 校验固定电话的2个输入框，一个字段
vue中校验固定电话前后的两个输入框，在父页面只允许校验一个字段，解决方案：可以选择组件传值这里面 input组件默认接受的值叫做——————props:{value}子组件向父组件用$emit方法传值———————input,将分割成的两个值组成一个值默认传给父组件中的那个值“telephone”父组件中 <el-col :span="12"> ...
2020-04-16 18:11:43
514
原创 vue中this.$route.params和this.$route.query的区别？（开发中遇到的问题）
1.this.$route.query的使用A、传参数：this.$router.push({ path: '/monitor', query:{ id:id, }}）B、获取参数：this.$route.query.idC、在url中形式（url中带参数）http://1...
2020-03-18 10:11:33
935
原创 什么是跨域？如何解决？
1.什么是跨域？跨域：指的是浏览器不能执行其他网站的脚本。是由浏览器的同源策略造成的，是浏览器对js施加的安全限制。2.什么是同源策略？同源是指协议，域名，端口相同。当页面在执行一个脚本时会检查访问的资源是否同源。非同源，请求数据时，浏览器会在控制台中报一个异常，拒绝访问。当前页面的url 请求页面的url 是否跨域 原因 http://www.test.co...
2020-02-17 13:25:33
603
原创 vue 正则表达式
vue 校验匹配非法字符： /[@#\$%\^&\*\s+]+/g关键字中含有特殊字符：/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g\s表示空白字符。包括，空格，制表符等""只表示空格\s+可匹配至少一个空白字符[ ]+...
2019-11-18 13:41:03
4578
1
原创 针对英文&&数字&&中文通用，文本溢出显示省略号
overflow:hidden;white-space:normal;word-break:break-all;text-overflow:ellipsis<!doctype html><html class="no-js" lang=""><head> <meta charset="utf-8"> <title>&l...
2019-10-25 15:14:26
347
原创 滚动公告 vue.js
也可以用vue动画去做vue.js代码如下：<html><head><meta charset="UTF-8"><title>最新战报</title><style></style></head><body><div class="v...
2019-10-11 09:37:27
218
原创 vue+element省市区三级联动（可直接使用）
$emit：父传子props：子传父<template> <section> <el-select v-model="provinceAreaCode" placeholder="请选择" @change="getCityList"> <el-option v-for="...
2019-09-24 16:42:15
5599
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人