自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue3父子组件传值

【代码】vue3父子组件传值。

2024-02-20 23:18:29 469

原创 vue3使用pinia

vuex: 集中式管理状态容器, 可以实现任意组件之间通信;核心概念: state\mutations\actions\getter\modules。pinia: 集中式管理状态容器, 可以实现任意组件之间通信 核心概念: state\actions\getters。pinia类似于vuex, 但相对于vuex少了mutations和modules。

2024-02-20 20:56:29 269

原创 使用jsZip实现打包下载文件

使用jszip实现多个文件压缩成一个压缩包并下载。

2024-01-01 15:57:04 854

原创 el-select二次封装实现可分页加载数据

使用el-select时一次性渲染几百条数据时会造成页面克顿, 可以通过分页来实现, 这里我用的方式为默认获取全部数据, 然后一次性截取10条进行展示, 滚动条触底后会累加, 大家也可以优化为滚动条触底后发送请求去加载数据。

2023-12-19 18:41:11 892

原创 vue使用slot封装navBar

1、创建navBar.vue文件。2、在页面使用页面中引入并使用。// 是否显示左侧内容。

2023-11-27 14:44:57 595

原创 uniapp实现下载图片到本地

uniapp实现下载图片到本地

2023-11-16 16:52:11 1971

原创 vue使用js生成图片验证码

1、创建Identify.vue文件,用来生成验证码。2、在需要显示图片验证码文件里引入。使用canvas生成图片验证码。

2023-11-15 17:37:39 278

原创 js将树状结构数组转为普通数组

【代码】js将树状结构数组转为普通数组。

2023-08-28 17:36:56 227

原创 js将搜索的关键字加颜色

使用正则匹配关键字并加入span标签,页面渲染时使用v-html渲染即可。

2023-08-23 18:00:54 403

原创 js将数组格式化成树状结构

【代码】js将数组格式化成树状结构。

2023-08-15 16:02:31 122

原创 js如何获取字符串大小是几M

在上述代码中,getStringSizeInBytes函数接收一个字符串作为参数,并使用Blob对象将字符串转换为字节数组。然后,通过将字节长度除以1024*1024来计算字符串的大小(以兆字节为单位)。最后,将结果返回并打印到控制台。请注意,这种方法计算的是字符串在内存中占用的字节大小,而不是字符串在网络传输中的实际大小。如果字符串包含非ASCII字符或Unicode字符,那么由于编码的原因,实际的传输大小可能会更大。

2023-08-15 15:54:01 1216

原创 el-carousel加载缓慢问题

el-carousel加载缓慢,如果点击下一个或者上一个按钮时,加载速度很快,否则需要等2秒左右才能显示。已经确定不是接口问题,后来各种百度才知道el-carousel会自动添加了一个空的数据。

2023-08-14 09:59:31 348

原创 js使用正则表达式去掉标签

在上面的代码中,我们定义了一个 stripHtml 函数,它使用正则表达式 /<[^>]+>/g 匹配所有的 HTML 标签,并使用 replace 方法将它们替换为空字符串。最后,我们将富文本内容传递给该函数,并将返回的纯文本内容打印到控制台上。

2023-08-01 17:36:36 633

原创 nginx配置auth_basic认证

1、下载 httpd 下载地址: https://www.apachelounge.com/download/2、生成密码:打开cmd,进入到 Apache24\bin后其中: G:\nginx\nginx-1.14.2\conf为你自己的nginx位置user为用户名, 可以根据自己的情况定义输入完成后打回车后输入密码, 再次输入密码即可;3、找到nginx.conf文件,在需要做安全认证的地方添加配置完成后重启nginx;

2023-07-28 16:42:30 901

原创 echarts Cannot read properties of null (reading ‘setOption‘)

可以使用 echarts.init 函数创建 ECharts 实例并在回调函数中调用 setOption 方法,或者使用 setOption 方法提供的第二个参数 notMerge 来控制是否合并新的配置。如果以上方法无法解决问题,还可以尝试检查代码中是否存在 ECharts 实例被重复创建或者销毁的情况,以及是否存在其他代码影响 ECharts 实例的加载和渲染。以下是一个使用 echarts.init 函数创建 ECharts 实例的示例代码。其中,true 表示合并新的配置,不清除旧的配置。

2023-07-18 13:51:31 2353

原创 文字超长省略打点

可以使用css来处理: overflow: hidden;如果想要实现头部省略打点, 尾部完全展示, 可以使用direction: rtl;

2023-07-17 13:58:40 212

原创 使用多次定时器导致页面卡死解决方案

在开发时, 难免会遇到使用定时器定时获取数据, 但是时间久了后会导致浏览器直接卡死, 原因是js的单线程引起的, setInterval不会清除消息队列, 每执行一次都会导致定时器叠加, 直到浏览器卡死, 以下两种方案希望可以帮助您。

2023-07-13 16:32:14 1483

原创 自定义设置echarts label里的颜色

【代码】自定义设置echarts label里的颜色。

2023-07-11 17:37:23 615

原创 echarts柱状图设置每个柱为不同的渐变色

以上效果话不多说, 直接开干。

2023-07-07 22:03:15 456

原创 vue使用计算属性计算两个input的值

vue使用计算属性计算两个input的值

2022-10-12 11:36:16 1426 1

原创 el-table实现多选及反选

el-table实现多选及反选

2022-10-09 10:40:48 2664 2

原创 遍历对象并改变对象某个属性的值

遍历对象并改变对象某个属性的值function ergObj(){ let obj = { name: '张三', age: 18, address: '月球' }; for (let attr in obj){ // 打印对象的所有属性和值 console.log(attr+": "+obj[attr]); // 更改对象的name值 attr == 'name' ? obj[attr] = '李

2022-02-18 14:09:29 1709

原创 vue+element-ui实现form表单动态验证是否为空并且验证是否只能输入数组或者小数

vue+element-ui实现form表单动态验证是否为空并且验证是否只能输入数组或者小数<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0,

2022-02-14 16:32:02 1861

原创 浏览器定时器离开标签是会变慢问题

定时器离开标签是会变慢问题对于不方便使用webSocket的实时页面来说,需要用到setInterval或者setTimeout, 但是在使用他们的时候我们会发现离开当前标签后等待一段时间定时器会变慢,就像休眠状态一样,本来一秒钟执行一次,结果变为一分钟或者更长才执行一次,这个问题困扰了我很久,最终在git上找到解决办法,还不错,来给大家分享一下: 1, 安装 worker-timers npm install worker-timers 2, 导入 import * as worker

2021-06-23 14:49:55 782

原创 vue新建项目

vue新建项目1、 首先查看是否安装node.js在cmd里输入 node -v如果没有安装请到node.org.下载安装即可。2、全局安装vue-clinpm install vue-cli -g3、查看vue-cli是否安装成功 vue -V4、如果出现上图所示,表示已安装成功,下面来创建新项目vue create my-project// myproject代表项目名称,可按自己需求5、到这一步打回车即可,耐心等待。6、到这一步我们已经成功的创建了第一个vue项目,启

2021-03-06 17:15:03 213

原创 vue项目中自动生成二维码

vue项目中自动生成二维码我们在做vue项目时,很多时候要用到生成二维码的功能,今天给大家介绍一个有前端生成二维码的小例子:1、安装vue-qr:npm isntall vue-qr --save2、在组件中引入<template> <div> <vue-qr :logoSrc="imgPath" :text="value" :colorDark="stype" :size="150"></vue-qr> </div>&l

2021-03-06 14:23:40 572

原创 websocket的使用及nginx通信的ws代理配置

websocket的使用及nginx通信的ws代理配置最近在做的vue项目要使用websocket,本文讲述了websocket在vue中使用及打包后使用nginx代理。1、创建vue项目,这里不在详细去说,如果在创建项目时有疑问请访问:link.<template> <div></div></template><script> export default { name: 'socket', data(){ re

2021-03-05 15:29:05 1556

原创 vue子组件调用父组件内的方法

vue子组件调用父组件的方法在子组件里用$emit向父组件触发一个事件,父组件监听这个事件即可父组件<template> <div> <child @fatherFunc="fatherFunc"></child> </div></template><script> import child from './components/child'; export default {

2020-10-22 12:32:04 189

原创 vue使用md5给密码进行加密

vue使用md5给密码进行加密安装md5npm install js-md5 --save在min.js里全局引入md5import md5 from 'js-md5';Vue.prototype.$md5 = md5;在需要使用的文件里进行使用let password = this.md5(123456)注: md5是不可逆的密码加密方式...

2020-09-23 10:29:51 1055

原创 vue使用datepicker封装日历组件

vue使用datepicker封装日历组件安装datepickernpm install vue-datepicker --save新建time.vue页面<template> <div> <myDatepicker :date="startTime" :option="multiOption" :limit="limit" v-model="dataForm.createDate" ></myDatepicker> </div>

2020-09-18 15:24:24 564

原创 VUE删除数组指定的元素

vue删除数组中指定的元素export default{ data(){ return { mpList: ['测试一','测试二','测试三'] } }, methods:{ del(item){ let listVar = new Array for(let i=0; i<this.mpList.length; i++){ listVar.push(this.mpList) if (this.mpList[i] == item){

2020-08-22 15:22:21 24727 2

原创 js获取对象里数据条数

js获取对象里数据条数对象无法使用length获取长度,需要使用js原生方法里的Object.keys方法进行获取,具体用法如下:let obj = {'a1': {'name': '张三''},'a2':{'name': '李四'}}let arr = Object.keys(obj)console.log(arr.lenght)方法二let obj = {'a1': {'name': '张三''},'a2':{'name': '李四'}}let arrs = []for(let

2020-07-28 18:11:49 2236

原创 vue列表去重

vue列表去重vue列表去重let arr = [1,1,2,3,4,2,5,2,1,3]let newList = [...new Set(arr)]console.log(newList)

2020-06-15 10:20:47 3096 1

原创 js列表去重

js列表去重 - 最简单的方法使用es6的方法给列表去重function unique(arr){ return Array.from(new Set(arr))}var arr = [,1,1,2,4,5,3,1,2]console.log(unique(arr))使用双重for循环给列表去重function unique(arr){ for (let i=0; i<arr.length; i++){ for(let j=i+1; j<arr.length; j++){

2020-06-15 10:18:18 3200

原创 vue点击div更换颜色

vue点击div更换颜色<template> <div class="box" :class="boxColor =! boxColor"></div></template><script> export default { data (){ return { boxColor: false } }, methods:{} }</script><style> .box{

2020-05-22 15:03:32 3931 1

原创 浅谈get请求与post请求的区别

get请求与post请求的区别HTTP 中包括许多方法,Get 和 Post 是 HTTP 中最常用的两个方法,基本上使用 HTTP 方法中有 99% 都是在使用 Get 方法和 Post 方法,所以有必要我们对这两个方法有更加深刻的认识。get方法一般用于请求,比如你在浏览器里输入www.baidu.com. 其实就是发了一个get请求, 它的主要特征是请求服务器返回资源.post方法...

2020-04-25 10:36:44 135

原创 js随机生成字符串

js随机生成字符串平时我们都会遇到js随机生成整数数字,但是也会遇到随机生成字符串的时候,一下列子是在26位英文字母中随机生成想要长度的字符串 function randomString(length){ var str = 'ABCDEFGHJKMNPQRSTWXYZ' var strLength = str.length var arr = '' ...

2020-03-11 15:35:33 240

原创 js反转数组

js反转数组我们想要用js反转数组时,只需要用到reverse()就可以了,具体用法如下:var arr = [1,2,3,4,5]arr.reverse()console..log(arr)

2020-03-10 16:47:26 1228

原创 替换字符串中的任意字符及正则隐藏手机号中间四位

替换任意字符串中的字符替换字符串中的任意字符,在这我们使用一串数字模拟手机号码进行替换var str = ‘12345678901’var newStr = str.substr(0,8)+"****"console.log(newStr)输入结果为 1234567****替换字符串中间的任意字符var str=‘希望程序届中的大哥大姐们再无bug’;a=str.subst...

2020-02-24 21:59:20 1066

原创 js获取DOM元素的方法

js获取dom元素的方法通过ID获取 (getElementById)通过name属性 (getElementByTagName)通过类名 (getelementsByClassName)通过选择器获取一个元素 (querySelector)通过选择器获取一组元素 (querySelectorAll)获取HTML的方法 (document.documentElement)...

2020-02-02 16:52:24 274

空空如也

空空如也

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

TA关注的人

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