自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 上传图片转base64编码得分方式 canvas用法

上传图片转base64编码得分方式 canvas用法。

2024-03-25 16:29:11 150

原创 el-select 中嵌套时间选择器 el-time-picker 并且实现时间多选功能

需求是:时间可多选 element中时间的选择不支持多选 下面进行封装拼接时间多选。

2024-03-01 09:18:08 933

原创 vue3中 动态修改css样式内容的两种方法

第二种方法 直接在css中使用v-bind进行设置。第一种:直接修改style样式设置如下。

2024-02-22 10:22:35 2715

原创 elementUI 动态校验表单数据的方法

:rules=“rules.title” //title 名称可自己定义。这里主要设置两块内容 prop为动态数据 rules设置需要校验的值。list 为动态获取的数据值列表数据。

2024-02-20 18:00:13 1052

原创 vue中使用moment 设置倒计时的方法

日常开发中时常需要使用倒计时的方法 现在进行封装一下。

2024-02-05 14:23:50 921

原创 elementUI 表格中如何合并动态数据的单元格

效果如下 第2行 和最后一行进行了合并 其他没有合并。ui中提供的案例是固定写法无法满足 实际开发需求。下面进行改造如下 准备数据如下。

2024-02-05 13:55:54 1131

原创 element中form校验中清除校验不通过的提示语

clearValidate(‘festivalTime’)//清除校验错误信息。实际开发中 有些校验提示因为种种原因不隐藏 这时候如何让提示信息隐藏呢?这里可以指定清除prop中设置的数据festivalTime。可以使用系统自带的方法 clearValidate。//这里清除所有校验提示信息。

2024-01-25 14:03:46 1150

原创 el-select嵌套el-select或者嵌套el-time-picker点击选择内层的日期时间导致外侧的el-option收回问题的解决办法

其中就是el-select嵌套el-time-picker时间选择 当选择时间时el-select的下拉框自动收回了的问题。el-time-picker 添加 @visible-change=“visTimeChange” 对应方法如下。下一步:判断el-select 标签下拉框是否出现或隐藏 visible-change 下拉框出现/隐藏时触发。2:el-select 标签中添加绑定方法 v-click-outside=“closeBox”3:页面中定义对应的方法。

2023-05-25 15:22:14 1744 1

原创 vue3+vite 配置反向代理和跨域 设置端口号

在vite.config.ts 文件中直接配置。

2022-10-19 14:08:30 3486

原创 使用mddir生成项目的工程结构

1、先全局安装插件 npm install mddir -g2、在项目文件夹中 打开cmd 输入mddir 直接生成项目结构文档3、找到名字:directoryList.md的文件就是目录工程文件树

2022-10-13 11:18:51 361

原创 vue3打包时提示 TS2322:Type ‘() => void‘ is not assignable to type ‘MouseEvent‘.

提示信息:不能将类型 ‘() => void’ 分配给 ‘MouseEvent’出现这种原因就是新安装的 @types/node 在18.8.4版本之后。在页面中使用在页面上使用@click会有错误提示。然后安装18.7.18版本的就可以了。更改@types/node 的版本。

2022-10-13 10:22:35 4206 1

原创 vue3+vite中配置路径别名@

在compilerOptions字段中添加: “baseUrl”: “./”,“paths”: {“@/安装@types/node 这个配置地址时会用到。

2022-10-12 17:26:38 3141

原创 vue3+vite中使用环境变量 .env 的一些配置情况说明

在项目文件中新建文件.env .env.pro 两个文件其中.env 是默认设置 .env.pro 为正式环境设置。console.log( import.meta.env) //查看相关信息 这里不显示非VITE开头的变量。正常使用的时候没有提示信息,想增加提示信息在vite-env.d.ts或者env.d.ts进行如下配置即可。使用 import.meta.env.VITE_NODE_ENV 获取环境变量。还是使用 process.env.NODE_ENV。

2022-10-12 14:04:07 10414

原创 vue3中setup语法糖的一些方法的使用总结记录

基本使用:setup写在标签script上,script setup 标签中无需return 变量、函数。vue提供了provide和inject帮助我们解决多层次嵌套通信问题。在目录src下新建文件夹 hooks ==> index.ts。

2022-10-11 11:14:29 2804

原创 vue3状态管理工具 pinia的使用

pinia是一个轻量级的状态管理库,属于 vue3 生态圈新的成员之一,也可以把它看做 vuex5,同时支持 vue2 和 vue3,模块化的设计让它的结构十分地清晰明了。这种写法和我们之前使用的 vuex 简直一模一样,区别就是 pinia 将mutations方法取消了更方便我们使用。例子:在src/stores下新建一个myStore.ts文件。在 main.ts中引入。

2022-09-27 15:26:35 1031

原创 nginx解决静态页面中ajax跨域方案配置

有些老项目遗留的静态页面使用jquery中ajax 又不想使用webpack或者gulp启动,用Nginx配置跨域问题。然后进入nginx\conf下的 nginx.conf 下 使用编辑器vscode或者其他编辑器打开进行配置信息修改。配置好后使用命令 nginx -s reload (在nginx文件夹下启动cmd终端后输入命令重启Nginx)然后在浏览器输入localhost:4000 出现如下图信息这Nginx配置成功。配置完成后重启Nginx cmd中输入命令nginx -s reload。

2022-09-06 10:46:00 1531

原创 js中进行字符串替换的方法

1,str.replace(“需要替换的字符串”,“新字符串”), 这个只替换第一个查找到的字符。2,str.replace(/需要替换的字符串/g,“新字符串”) 这个全局替换查找到的字符。

2022-08-15 13:31:48 74572

原创 js中 两个数组进行判断含有相同项对相同项添加Key:Value属性值

直接上方法使用map循环。

2022-07-27 16:41:15 1784

原创 vue中 class 和 :class 的使用

vue中 class :class 的 多个样式的写法注意不能写多个class。

2022-07-21 11:17:26 3170

原创 element的中手动上传Upload文件做法,文件上传时转换成base64格式

手动上传主要是配置参数 :auto-upload=“false” 的使用 设置true则代表自动上传(即选择文件就开始上传服务器)其他配置如下如果不想使用base64格式提交 还可以使用FormData() 方法数据信息提交 只需要在提交代码时进行数据序列化就行...

2022-07-11 15:57:21 3415

原创 js数组删除指定数据方法

js数组中删除指定数据1,splice 删除(配合indexOf()方法)2,filter 删除3,Set 删除

2022-07-11 13:00:35 26101

原创 VSCode 安装离线插件的方法

实际工作中发现有些小伙伴的公司无法上网,只能在内网开发,这时候想使用VSCode的时候有些插件用不了 这时候就需要下载插件然后再离线安装使用了第一步:首先你需要有个上网的环境,找到你需要的插件如图第二步:点击右侧插件名字后会跳转到对应的插件应用网站 再网页的右下角点击Download Extension 直接网页下载第三步:将下载后的插件(后缀名为:vsix)发送到你的内网电脑中如下图操作即可安装对应的插件以上就是离线安装VScode插件的步骤了,希望对你有用,谢谢...

2022-06-28 13:51:15 2459 1

原创 npm出现报错 npm WARN config global `--global`, `--local` are deprecated. Use `--location=global

解决:npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

2022-06-28 10:37:34 10922 13

原创 搜索中清空对象属性的值方法

一般搜索中的都是对象模式,这种情况使用重置按钮清空对象中值的方法如下第一种:常规for in循环来做第二种方法:以上方法只适合简单的对象清空属性的值 如果遇到对象嵌套对象的情况使用如下方法:...

2022-06-28 10:10:22 1351

原创 css实现页面瀑布流样式的方法

css实现页面瀑布流样式的方法两种方法:1,css3的样式 column-count 2,flex布局方式方法一:** column-count 方式,这种方式IE浏览器不支持(10以下)更适合手机端使用,缺点是:图片是先从上到下排列,再从左到右排列的**body {margin:0 auto;width:500px;}.box{column-count: 4;//显示的列数(几列显示)column-gap: 10px;//每列之间的间隔距离}//---------------

2022-05-05 14:35:58 2812

原创 Vue使用ref结合ElementUI中的Dialog实现弹框的封装使用

vue使用ref结合ElementUI中的Dialog实现弹框的封装使用

2022-03-10 14:29:45 2826

原创 vue项目获取浏览器地址栏参数方法 ?aaa=111&bbb=222(非路由传参)

vue项目获取浏览器地址栏参数?aaa=111&bbb=222(非路由传参)项目中遇到一个需求,就是另一个管理系统带参直接单纯的跳转跳转到vue pc项目中的某个页面,后再初始化查询数据,参数以地址栏的形式传入管理系统:打开新地址地址(跳转新页面使用 _blank )let obj = { id: 21, name: “测试传参” };window.open(“http://loc...

2019-11-25 10:14:05 5189

原创 vue项目如何监听窗口变化,达到页面自适应?

vue项目如何监听窗口变化,达到页面自适应?使用方法:获取窗口宽度:document.body.clientWidth监听窗口变化:window.onresizeJS里这些方法:网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth (包括...

2019-11-25 10:00:32 1930

原创 基于vue element-ui的滚动条样式修改

基于vue element-ui的滚动条样式修改做vue项目使用Element UI组件库时 需要使用滚动条但是windows浏览器默认的滚动条太丑不美观和UI库界面不搭配需要考虑优化滚动条样式vue Element UI官方文档上并没有放出滚动条相关的示例说明,但是实际上是有这么一个组件的element-ui隐藏组件scrollbar的使用使用方法如下:使用上述标签把要出现滚动的...

2019-11-20 18:49:48 1643

原创 vue引入第三方js的方案 报错<

vue引入第三方js的方案 报错<问题描述vue项目中引用一个外部js包 npm中没有响应的js下载 所以只能通过外部引用使用方法如下:1、首先是第三方js包存放的位置 一定要放在 static 目录下否则引用不到2、在vue项目的index.html 中引入js包 注意: 在index.html引入外部js时 src=“static/xxxxx.js” 的...

2019-11-19 16:04:20 1154

原创 vue element-ui 第一次打开Dialog 对话框无法加载内容的问题

vue element-ui 第一次打开Dialog 对话框无法显示内容 第二次正常显示问题描述:今天需要使用Dialog 弹框中加载video视频显示,问题如下第一次点击弹框可以正常显示 但是内容不加载 报错 第二次可以正常显示内容也加载问题原因:出现这个问题的原因是js加载了 但是Dialog 的dom并没有加载完全导致js报错所以不加载查看官方文档解释如下:Dialog 的内容...

2019-11-19 15:47:53 4237 1

原创 vue中 配合elementUI实现 勾选多选框在指定区域添加相应数据并实现联动效果

vue中 配合elementUI实现 勾选多选框在指定区域添加相应数据今天在做项目中遇到了小问题,实现勾选按钮在指定区域添加数据并实现联动效果如上图:勾选按钮 在下侧添加数据 并实现联动不废话 上代码:数据自定义的对象结构:数据格式如下:textarea :'',//存放联动数据xzTypeList:{ '协助司法送达':'协助司法送达:请协助法院完成对被执行人的送...

2019-08-28 18:16:54 2055

原创 vue-取消严格模式,去除格式警告

vue-取消严格模式,去除格式警告我们日常在写vue代码的时候,会遇到很多警告信息,这是因为我们在创建代码的时候一直写yes,或者敲回车,也就是默认安装了eslint的严格模式。在运行测试的时候,会出现很多警告和错误,页面显示会变得十分麻烦,如果习惯了就可以养成很好的代码习惯。那么如何去除这些警告呢,关闭严格模式,只要在build文件夹下的webpack.base.conf.js中的…(co...

2019-08-26 10:35:41 4854 3

空空如也

空空如也

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

TA关注的人

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