- 博客(42)
- 收藏
- 关注
原创 vue3使用pinia
vuex: 集中式管理状态容器, 可以实现任意组件之间通信;核心概念: state\mutations\actions\getter\modules。pinia: 集中式管理状态容器, 可以实现任意组件之间通信 核心概念: state\actions\getters。pinia类似于vuex, 但相对于vuex少了mutations和modules。
2024-02-20 20:56:29 269
原创 el-select二次封装实现可分页加载数据
使用el-select时一次性渲染几百条数据时会造成页面克顿, 可以通过分页来实现, 这里我用的方式为默认获取全部数据, 然后一次性截取10条进行展示, 滚动条触底后会累加, 大家也可以优化为滚动条触底后发送请求去加载数据。
2023-12-19 18:41:11 892
原创 vue使用js生成图片验证码
1、创建Identify.vue文件,用来生成验证码。2、在需要显示图片验证码文件里引入。使用canvas生成图片验证码。
2023-11-15 17:37:39 278
原创 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
原创 遍历对象并改变对象某个属性的值
遍历对象并改变对象某个属性的值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关注的人