- 博客(41)
- 资源 (1)
- 问答 (1)
- 收藏
- 关注
原创 vue 项目中,enter 键提交触发两次的原因及解决方法
enter 事件发生的时候同样失去了焦点,所以会触发 blur 事件。看看你的 blur 事件是不是和enter 事件是同一个方法。如果你要是想着说定义两个方法,若他们的操作是一样的,根本解决不了问题,依旧会执行两个方法名不同的两个函数体,最简单的解决方法如下
2023-01-31 09:57:04
1899
1
原创 uniapp iPad 开发 横屏锁定配置,开启此设置后,开启自动旋转也不能竖屏
uniapp iPad 开发 横屏锁定配置,开启此设置后,开启自动旋转也不能竖屏
2022-12-02 16:31:31
2784
5
原创 在 uniapp 中使用 textarea 报错 “Invalid prop: custom validator check failed for prop “confirmType“” 及解决
亲测解决在 uniapp 中使用 textarea 报错 “Invalid prop: custom validator check failed for prop "confirmType"” ,只需一行代码
2022-11-08 10:03:21
2807
4
原创 uniapp扫码和生成二维码 qrcodejs 实现详解
uniapp扫码和生成二维码 qrcodejs 实现详解复制即用,包含遇到的bug及解决
2022-10-28 09:37:36
5333
2
原创 亲测解决:warning ....No license field 问题
亲测解决:warning ....No license field 问题
2022-08-03 12:51:03
6905
3
原创 localStorage、sessionStorage 和 cookie 的区别大总结
1.相同点三者都是用来存储数据的,且都遵循同源策略,其中 sessionStorage 还限制是同一个页面。2.不同点(1)生命周期不一致localStorage 除非手动清除,否则一直存在;sessionStorage 当页面关闭时就会自动清除;cookie 在一开始写入时就设置好了,如果没有设置,则和浏览器的会话期保持一致;(2)存储位置不一致localStorage 和 sessionStorage 是从前端写入的,cookie 是从服务端写入的;(3)存储大小不一致localSt
2022-06-22 09:14:50
152
原创 图片懒加载
图片懒加载思路及实现1.以插件的方式,全局注册指令插件在 src/directives/index.js 中,复制以下代码:import { useIntersectionObserver } from '@vueuse/core'// 默认图片(当有的图片加载失败时生效)import defaultImg from '@/assets/images/200.png'export default { install (app) { // 自定
2022-05-27 17:07:49
101
原创 使用 vuex-persistedstate 插件持久化vuex中的数据
vuex 经过刷新后数据会丢失,所以在开发中我们一般会将vuex中的数据持久化。其中,vuex-persistedstate 插件可以将数据存储到 localStorage 中,vuex 再从localStorage 中读取数据1.下载 vuex-persistedstate 插件yarn add vuex-persistedstate或者npm i vuex-persistedstate2.在 store/index.js 中引入并配置(1)引入import crea
2022-05-26 20:30:21
434
原创 自定义插件并注册
1.在自制插件之前,先来看一下Vue官网插件的原理安装 Vue.js 插件。如果插件是一个对象,必须提供 install 方法。如果插件是一个函数,它会被作为 install 方法。install 方法调用时,会将 Vue 作为参数传入。该方法需要在调用 new Vue() 之前被调用,不需手动调用。
2022-05-06 17:31:39
478
原创 什么是跨域、为什么要跨域、怎么解决跨域
什么是跨域、为什么要跨域、怎么解决跨域 例如:http://192.168.0.1:8080与https://192.168.3.1:8080不是同源,因为协议不同,第一个冒号前面的为协议,中间的为域名,第二个冒号后面的为端口,只要满足有一处不同,则就不是同源。所谓跨域就是从 A 向 B 发请求,如若他们的地址协议、域名、端口都不相同,直接访问就会造成跨域问题,跨域是非常常见的现象!请求是跨域的但并不一定会报错,普通的图片请求。css文件请求是不会报错的。报错的条件是浏览器的
2022-04-29 21:25:29
18243
原创 Echarts一些社区网站,亲测可用,新更新了Antv(阿里旗下)
1.makeapie echarts图表可视化案例makeapie echarts图表可视化案例, 分享你的可视化作品https://www.makeapie.cn/echarts2.Examples - Apache EChartsECharts, a powerful, interactive charting and visualization library for browserhttps://echarts.apache.org/examples/zh/index.html#chart-ty
2022-03-22 15:03:41
13472
3
原创 3种场景下的非空判断(简单)
1.场景一:如果只有一个输入框,建议使用trim()=='',trim()不仅可以检测空字符串,还可以检测空格。如下所示:<form action=""> <input type="text" placeholder="请输入用户名" class="username"> <button>登录</button> </form> <script> /* 点击登录按钮,进
2022-03-17 21:36:48
949
原创 ES6中数组新语法:map()、filter()、forEach()、some()、every()、findIndex()、reduce()的介绍及举例说明,详解
ES6中数组新语法:map()、filter()、forEach()、some()、every()、findIndex()、reduce()的介绍及举例说明,详解
2022-03-12 21:29:35
1307
原创 localStorage与sessionStorage异同点(面试题)
1.相同点:都是用来存储数据的,语法作用一致。存数据:localStorage.setItem('属性名','属性值')取数据:localStorage.getItem('属性名')删除数据:localStorage.removeItem('属性名')清空数据:localStorage.clear()存数据:sessionStorage.setItem('属性名','属性值')取数据:se...
2022-03-05 17:24:48
395
原创 统计文本输入域字数(附实现思路和源码)
实现思路:这个涉及到事件知识点。事件三要素:事件源(什么发生变化)、事件类型(怎么发生)、事件处理函数(发生什么事)。统计文本域字数:随着用户在文本域的输入,字符串长度不断变大,修改统计数量标签的文本。事件源有两个,第一个是文本域(用户要输入字符串),第二个是修改字符串的标签文本内容(因为数量在发生变化),事件类型是键盘输入(oninput),事件处理函数是将字符串长度赋值给标签,标签的文本内容发生变化。<!DOCTYPE html><html lang="en"><
2022-02-26 19:29:34
464
原创 开关思想(判断数组中是否所有的元素都满足条件)
1.声明一个开关变量,默认值为true2.遍历数组,检查每一个元素是否满足条件,如果存在不满足的,修改开关为false3.获取开关变量的值(也可以加break,当开被修改后,直接跳出循环)function poNum(arr) { let bol = true for (let i = 0; i < arr.length; i++) { if (arr[i] < 0) { bol = false bre
2022-02-23 16:54:15
621
1
原创 逻辑中断(短路)
逻辑与&&(找假)逻辑与:简答记忆口诀,全真为真,一假则假。当运算时,只有逻辑与左右两边的式子都为真(true)时,才能返回true。当存在有一个为假时,返回false。以下面为例:逻辑与运算符左边式子10>1条件为真,右边式子2>1也为真,所以结果返回为true res = 10 > 1 && 2 > 1 console.log(res)//true逻辑与运算符左边式子10>1条件为真,右边式子1>...
2022-02-23 15:54:44
617
原创 盒子居中的三种方法(最简单)
1.利用定位(子绝父相)、margin-left、和margin-top实现子盒子相对于父盒子进行移动。在父盒子内,先移动父盒子宽的一半,再移动父盒子高的一半。此时的子盒子在父盒子的偏右下的位置,再次需要移动子盒子,将子盒子向左移动自身宽度的一半,再向上移动自身高度的一半。缺点在于如果修改了子盒子的宽高,则就需要修改margin-left和margin-top的值.father { /* 给父盒子设置相对定位 */ position: rel
2022-02-16 15:55:09
25351
原创 立体骰子实现3D炫酷旋转效果(附完整源码)(附动画代码)
整体思路:首先搭建骰子整体的立方体1.先搭建前后两个面(front和back),通过定位(子绝父相)将两个盒子定位在立方体正面,此时一面遮挡了另一面,在父盒子中添加transform-style: preserve-3d;达到3d立体效果,将前盒子沿z轴正方向移动高一半距离,后盒子沿z轴负方向移动高一半距离,前后盒子搭建完成,可搭配hover和过渡查看效果;2.左右盒子与步骤1类似,不过左右盒子是需要进行左右移动高一半距离,且需要绕Z轴转动;3.与左右盒子搭建类似,需要绕X轴转动,需要沿Y轴上下
2022-02-12 19:31:14
3012
前端知识点集合(完整版)
2022-02-27
TA创建的收藏夹 TA关注的收藏夹
TA关注的人