自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(72)
  • 收藏
  • 关注

原创 vue3+axios请求导出excel文件

后端返回的数据是一个二进制数据流,可以console.log(response)打印一下响应数据,查看数据是不是Blob类型,如果不是的话可能会出现乱码、undefined等情况。在Vue 3中使用axios请求导出Excel文件,可以发送一个GET或POST请求,并设置响应类型为。构造函数创建一个二进制文件,最后使用。生成一个可以下载的链接。

2024-08-05 15:37:56 434

原创 vue3+elementUI表格嵌入select组件,select组件选项之间互斥

1.第一步:通过计算属性获得对应数据列的参数list,这些list即已经选中的option选项。2.第二步:在标签中根据计算属性得到的list添加disabled。

2024-07-30 10:45:09 132

原创 vue3+cli-service配置代理,跨域请求

在vue.config.js文件中。

2024-06-04 15:47:39 337

原创 手机端访问本地vue项目

devServer添加配置: host: “0.0.0.0”, disableHostCheck: true。注意不是在浏览器直接输入IP显示的那个外网IP地址。

2024-04-26 16:49:42 942

原创 vue3+elementPlus el-calendar如何标出多个时间

【代码】vue3+elementPlus el-calendar如何标出多个时间。

2024-03-25 15:34:42 695

原创 vue3+elementPlus el-input禁止输入中文

这种写法会自动去掉输入的中文,如果是其他规则,可以将正则替换成自己需要的就可以。这里有比较常用的正则,可以作为参考。

2024-03-22 11:21:08 1111

原创 vue3+element-plus中dialog对话框组件去掉遮罩层后可以操作底层页面,以及弹窗嵌套弹窗如何去掉遮罩层且可以操作底层页面

三、如果是弹窗嵌套弹窗,以上方法可能不会去掉遮罩层,这时就需要添加官网给出的另一个属性:append-to-body,具体解释可以查看官网。是自定义类名,和下面代码中的类名相同即可。

2024-03-18 17:28:02 2067 1

原创 vue3+Echarts实现中国地图

3、如果引入的是china.json,那么需要配置echarts.registerMap('china', china),如果引入的是china.js文件就不需要了。4、如果出险加载后的数据没有颜色(如下图所示)可能是china.json文件里的name名字与数据上的name名字不对应,检查一下,name名字是否一致。全选复制,在项目文件src文件下创建一个json文件,并在里面创建一个vue文件命名为china.vue。2、引入顺序是china.json,然后是echarts。1、地图要设置宽和高。

2024-03-13 11:34:59 2102 2

原创 VUE3上传功能本地上传正常,打包上传后报错TypeError: ***.upload.addEventListener is not a function和文件上传请求地址

/这样就拿到了参数中的数据。//获取#/之前的字符串。一、erer这个错误很可能是因为在打包后,文件的路径或者名称发生了变化,导致代码中的某些方法无法正确找到。二、使用element-plus文件上传时,后端使用的时代理路径导致上传的url需要前端自己处理。1、文件node_modules/mockjs/dist/mock.js。

2024-03-04 17:01:35 1046

原创 vue中 :style 与 :class 三元运算符使用

如果想添加多个class,可以像代码里的’iconfont‘一样添加。

2024-02-27 09:43:21 813 1

原创 el-checkbox的默认值从true和false更改为0和1

【代码】el-checkbox的默认值从true和false更改为0和1。

2024-02-27 09:38:00 775

转载 Vue3中div自由拖拽宽度和高度

Vue3中我们会遇到自由拖拽宽度和高度的页面需求,查看很多方法都无法满足当前需求。下面是我们Vue3版本的代码,非常简单主要构想说粗发拖拽方法,把所需要的div的高宽进行拖拽位置进行监听来加减自身div的px值。直接复制粘贴就可以实现效果。根据自己需求更改即可投入使用,非常方便快捷。

2024-02-22 17:34:16 853

原创 vue3顶部内容固定定位,下面内容可以向上滚动

功能要求:一个div里有两个模块儿,顶部按钮模块儿和下面的内容区域模块儿,顶部按钮模块儿固定在顶部不随滚动条滚动,下面内容区域可以滚动。1、顶部按钮固定定位,会脱离文档流,下面内容区域需要加一个margin-top,margin-top的值是上面顶部按钮模块儿的高度。第一步:在utils文件里创建directive文件夹,在directive文件夹下创建一个resizeObserver.js文件。第二步:在directive文件夹再创建一个index.js文件,目的是为了集中注册自定义指令。

2024-01-03 14:24:48 918

原创 el-select如何去掉placeholder属性

注意:这种方式有时候会不生效可能会受其他文件样式影响如样式覆盖,组件属性继承等,所以可以通过修改样式来实现。找到项目里设置全局样式的文件,使用伪类选择器将placeholder属性文字颜色透明度设置成0。功能要求是:当el-select的disabled属性为true的时候不展示“请选择”字样。元素的 placeholder 属性,可以在代码中将其设置为空字符串。2、如果想要全局修改的话,可以使用css修改。

2023-12-20 11:02:10 883

原创 vue3屏蔽控制台的错误警告和黄色警告信息

只需要在main.js中写入下面代码就可解决。

2023-12-01 16:58:57 1066 1

原创 vue3实现元素拖拽移动功能

效果图。

2023-11-29 16:10:12 2313

原创 vue3父组件提交校验多个子组件

1、子组件中的form要添加ref属性,并使用defineExpose暴露出去,这样父组件才能获取到子组件中的ref,才能进行校验。2、当对表格输入内容做校验时prop和v-model绑定的是同一个才能校验通过。3、当发现校验一直不通过时可以查看控制台打印的的结果,看哪个校验没通过。实现功能:在父组件提交事件中校验多个子组件中的form。这个是表格可以增删改的情况,对表格添加输入校验。这个是普通的form表单情况。

2023-11-20 16:04:31 488

原创 vue3+elementPlus el-select组件同时支持label和value模糊查询

element ui的select组件设置filterable后, 默认支持的是通过label来进行过滤搜索,注意:遍历的时候的key值不要用index,因为数组是事实变换的会无法找到对应的项,最好是用value值。功能要求:下拉框数据展示label+value,选中后的数据只展示label。visible-change(下拉框出现/隐藏时触发)的事件来实现功能.想要下拉框数据里同时显示label和value可以用插槽的方式。官方文档上提供了filter-method来自定义搜索方法。

2023-10-17 17:38:26 1543 1

原创 JWT授权为啥要在 Authorization标头里加个Bearer 呢

Digest MD5 哈希的 http-basic 认证 (已弃用)Bearer 常见于 OAuth 和 JWT 授权;Basic 用于 http-basic 认证;AWS4-HMAC-SHA256 AWS 授权。这是因为 W3C 的。

2023-10-08 17:15:21 2140

原创 vue3+Element Plus,实现输入身份证号计算出出生日期、年龄和性别

【代码】vue3+Element Plus,实现输入身份证号计算出出生日期、年龄和性别。

2023-10-08 15:08:48 481

原创 vue3+elementPlus el-input的type=“number“时去除右边的上下箭头

【代码】vue3+elementPlus el-input的type="number"时去除右边的上下箭头。

2023-10-07 17:16:39 1209 1

原创 vue3+elementPlus ElMessageBox消息框取消按钮位置调整

项目里修改element里的样式有些需要添加deep,小编也是试了很多都行不通,只有重新写一个且不加任何属性信息,将上面的样式放在里面才会生效,不清楚为什么,有知道原因的欢迎留言分享。该方法是通过给取消按钮添加class然后修改样式,也可以给确定按钮添加class修改样式。要求所有的ElMessageBox消息弹出框的取消按钮放在右边,如图。确定按钮的class属性名是confirmButtonClass。

2023-10-07 16:57:18 1539

原创 vue3+elementPlus el-select 增加全选和取消全选

要求el-select支持多选,并增加全选和取消全选功能,缺点是提交的数据中会有全选这个字段。multiple是实现下拉框多选的属性。

2023-10-07 16:35:57 1169

原创 vue3父组件对多个子组件校验、校验定位方法

【代码】vue3父组件对多个子组件校验、校验定位方法。

2023-08-26 18:23:04 1621

原创 Vue父子传值子组件接收的6种接收数据类型

【代码】Vue父子传值子组件接收的6种接收数据类型。

2023-08-24 10:48:29 464

原创 vue3 + element-plus清除表单校验

使用:ref名称.value.resetField()

2023-08-22 17:11:24 1524

原创 vue3路由传参获取不到params,获取到为空

注意:从Vue Router的2022-8-22 更新后,我们使用param传参在新页面无法获取数据。

2023-08-17 16:23:48 4363

原创 vue3+elementPlus 多个表单一起提交并校验

【代码】vue3+elementPlus 多个表单一起提交校验。

2023-08-17 10:25:49 1575

原创 vue3+elementPlus table里添加输入框并提交校验

【代码】vue3+elementPlus table里添加输入框并提交校验。

2023-08-17 09:55:47 2977

原创 Vue3+Vite+Pinia

Vite是一种新型前端构建工具,能够显著提升前端开发体验Vite 意在提供开箱即用的配置,同时它的和带来了高度的可扩展性,并有完整的类型支持。搭建Vite项目相关命令:Vite解决@问题修改项目中的vite.config.js文件。

2023-07-22 15:10:25 230

原创 TypeScript初体验(三)

DefinitelyTyped是一个GitHub仓库,用来提高质量TypeScript类型声明,可以通过npm/yarn来下载TS类型声明包,这些包的名称格式为:@type/*,例如:@type/react等。4、Record:构造一个对象类型,属性键为Keys表示对象有哪些属性,属性类型为Type表示对象属性的类型,1、Partial:将Type的所有属性设置为可选,不会改变传入类型的本身,而是创建一个新的类型。表示只要是string类型的属性名称,都可以出现在对象中。

2023-07-03 14:49:57 667

原创 TypeScript初体验(二)

2、protected:表示受保护的,仅对其声明所在类和子类中(非实例对象)可见,子类的内部可以通过this来访问父类中受保护的成员,但是,对实例不可见。3、枚举成员的值都是字符串的枚举称为字符串枚举,需要注意的是字符串枚举没有自增长的行为,因此,字符串枚举的每个成员必须有初始值。枚举:定义一组命名常量,枚举的功能类似于字面量类型+联合类型组合的功能,也可以表示一组明确的可选值。1、参数个数,参数多的兼容参数少的(或者说:参数少的可以赋值给参数多的)

2023-06-19 18:54:41 955

原创 TypeScript初体验(一)

原理:ts-node命令在内部偷偷的将TS->JS,然后,再运行JS,此命令不会生成JS文件,也不会修改对应的JS文件里的内容。3、查看元素的类型:在浏览器控制台,通过console.dir($0)打印DOM元素,在属性列表的最后面可以看到该元素的类型。类型别名,不仅可以为对象指定类型,实际上可以为任意类型指定别名。元组类型是另一种类型的数组,他确切的知道包含多少个元素,以及特定索引对应的类型。为变量添加约束,约定了什么类型,就只能给变量赋值该类型的值,否则就会报错。类型别名可以是任意合法的变量名称。

2023-05-13 15:19:15 536 1

原创 修改node版本,项目起不来

在自己电脑上找到之前的node版本安装包,重新安装,把项目里的node_modules文件夹先删掉,重新在控制台运行。实在不行的话可以试试项目重新从git上获取。卸载当前版本node sass。如果你已经下载了node-那么可能是node的版本和。重新启动项目应该就可以了。的版本不匹配导致的。

2023-03-09 17:32:55 813

原创 vue 不是内部或外部命令

创建vue项目,vue指令报错处理

2023-02-07 11:04:42 204

原创 自定义平台主题配置

自定义主题配置

2023-02-03 15:43:46 165

原创 数组对象的深拷贝

2、当复杂一点数组,比如数组里面是对象的时候就不能使用结构语法了,可以使用JSON.parse(JSON.stringify(a))来实现。深拷贝不但对指针进行拷贝,并对指针指向的内容进行拷贝,经过深拷贝后的指针是指向两个不同地址的指针。浅拷贝主要是对指针的拷贝,拷贝后两个指针指向同一个内存空间,1、一维数组使用解构语法可以实现深拷贝。当a改变时,b不会变。

2022-10-08 11:22:12 3122

转载 Vue项目中设置elementUI的el-dialog上下左右居中

vue

2022-06-01 16:53:52 6509

原创 React通过jsonp获取高德在线天气数据

使用jsonp请求,首先安装一下 jsonpyarn add jsonp在项目里的api文件夹下的index.js文件里写一下代码import { message } from "antd"; //这个是引用的antd前端组件库import jsonp from "jsonp";//请求高德天气export const reqWeather = (city)=>{ return new Promise((resolve,reject)=>{ c

2022-05-17 15:07:21 707

转载 JavaScript中用到的方法总汇

参考地址JavaScript中常用的方法汇总,全部整理好了,一定要收藏! - zhang305 - 博客园https://www.cnblogs.com/PotatosMe/p/13751420.htmlhttps://www.cnblogs.com/PotatosMe/p/13751420.html

2022-04-11 15:14:35 78

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除