- 博客(20)
- 收藏
- 关注
原创 vue吊起ios的软键盘,阻止页面上滚,阻止触摸滚动和自动获取焦点
【代码】vue吊起ios的软键盘,阻止页面上滚,阻止触摸滚动和自动获取焦点。
2022-10-23 13:57:03
1513
1
原创 展示的元素 span 点击就可以展示为 input 进行操作
方法一, 找到 item 当前项对应的 index,点击的时候把 list[index].inputFlag = true, 在 input 元素上加上 v-show="item.inputFlag",或者新增一个当前点击 ShowIndex 变量, v-show=" index === ShowIndex" 这种方式比较常用方法二通过查找当前元素的兄弟元素,控制显隐 (都是玩具代码,大家自己找有用的地方哈)<div id="yaoshanchuId"> <span
2022-04-22 10:49:25
1117
原创 三栏布局,拖拽边框控制容器大小(爬坑。。。)
1.首先是三栏布局的拖拽栏的实现有两种办法1.1 纯css实现方式1.2 Js实现方式1.3由于我的需求中含有iframe的内容,所以会发生鼠标拖动过快,移动到iframe上面事件失效的情况,解决办法也是两种1.3.1 简单粗暴的解决方式 pointer-events: none; 和pointer-events: auto; 控制这个属性值的切换.previewFrame { //包裹iframe的父容器的类选择器 pointer-events: auto;}1.3..
2022-04-16 23:41:09
507
原创 关于 addEventListener 在 vue3 项目中使用,遇到的bug
遇到bug很烦躁,所以希望读到这个文章的你看到这个片太阳花,心情能好起来哈~
2022-04-16 23:04:51
9126
原创 关于点击 radio 外边包裹的 div,触发 radio 点击事件,扩大点击范围
<div class="radioBox" v-for="it in item.labelValue" :key="it" :style="{ width: largeWidth.includes(it) ? '188px' : '120px' }" :class="{ active: it === chooseDataList[item.key] }" @click="choos.
2022-03-24 14:23:25
1134
原创 关于 hover 和 active 同时出现的切换 状态换背景图
<div class="listItemStyle" v-for="(item, index) in list" :key="index" :class="{ active: item.type === showCom }" @click="chooseItem(item.type)" ></div>//下面是style.listItemStyle { &:hover { backg.
2022-03-22 18:22:28
401
原创 关于写一个vue3使用的VSCode 代码段
{"vue3": {"prefix": "vue3","body": ["<!-- $0 -->","<template>"," <div></div>","</template>","","<script lang='ts'>","import { defineComponent, reactive,toRefs,onBeforeMount,onMounted} from 'vue'","interface...
2022-03-22 17:44:27
176
原创 第一次使用vue3和工作中遇到的一些小问题总结
实用的小方法关于删除数组指定元素this.chooseIdList.splice(this.chooseIdList.findIndex(item => item === id),1);[].slice.call查找数组中最大项Math.max.apply(Math,widthList.map((item: any) => {return item.uploadData?.frame?.width;}));Computed 虽然是一个 function,但是它可以通过 ge
2022-03-21 16:57:29
1244
原创 浏览器对象模型
课程名称 前端模块化课程目标1.了解常见浏览器 JS 对象常见 API 及用法https://segmentfault.com/a/11900000142125762.浏览器内置对象详解3.浏览器事件模型详解4.浏览器请求相关内容详解课程要点一、什么是浏览器对象模型BOM :Browser Object Model(浏览器对象模型),浏览器模型提供了独立于内容的、可以与浏览器窗口进行滑动的对象结构,就是浏览器提供的 API其主要对象有:1. wind...
2021-05-07 17:50:13
2131
原创 ES6/ESNext规范学习笔记
课程名称 ES6/ESNext规范ES6/ESNext规范详解ES6/ESNext规范详解课程目标1.简单了解ECMAScript规范发展及历史 (每年6月发一版)2.ES6及以后新增的常⽤API解析3.简单了解一下Babel.js,写一个插件课程要点1.let 和 constfor(var i=0;i<=3;i++){setTimeout(function() { console.log(i)}, 10);}//分别会输出什么? 为什么? 如...
2021-05-07 17:49:25
604
原创 es6的剩余参数..args和map及set的使用
箭头函数是没有arguments的,我们可以用(...args)=>{}来使用,它是一个数组可以直接用剩余参数只能放在最后一个参数位置,否则就会报错剩余参数与结构赋值一起使用(必须是最后一个)const [num,...args] = [1,2,3,4];const fun= ([num,...args]) =>{} //这样使用都是可以的直接(...agrs)=>{}使用 它是数组,与解构赋值一起使用它就具体问题具体分析了展开运算符...
2021-04-26 16:17:22
264
原创 关于promiseA+规范的简单理解和应用
首先是简单描述一下promise的术语1. promise 是⼀个有then⽅法的对象或者是函数,⾏为遵循本规范 2. thenable 是⼀个有then⽅法的对象或者是函数 3. value 是promise状态成功时的值,也就是resolve的参数, 包括各种数据类型, 也包括 undefined/thenable或者是 promise 4. reason 是promise状态失败时的值, 也就是reject的参数, 表示拒绝的原因 5. exception 是⼀个使⽤throw
2021-04-20 19:58:24
228
原创 简单的实现了一个“小眼睛”控制用户密码的显示和隐藏
项目场景:在写项目的过程中遇到了要写一个简单的登录功能,因为是小的登录用户注册,就没有使用框架的表单,卸载这里当做一个记录了,实现的效果如图可以粘贴到vscode运行一下,van-icon如果没有的话可以自己写个其他div替代问题描述:我就简单的实现了一个“小眼睛”控制用户密码的显示和隐藏<template><divclass="loginWapper"><div><p>用户名:<inputtype...
2020-08-25 16:57:18
1123
原创 关于for循环
最近写代码的时候,又遇到一个很基础的知识点:循环数组时,哪种方法里可以使用break,以及return。下面总结一下:一、数组遍历1,普通for循环,经常用的数组遍历 1 2 3 4 vararr = [1,2,0,3,9]; for(vari = 0; i <arr.length; i++){ ...
2019-10-18 15:40:21
97
转载 面试题总结js方面
一、["1","2","3"].map(parseInt)答案是多少?答案是[1,NaN,NaN]原因 parseInt(param,i),其中param是传入的参数,i是格式化的进制,i不传或者传0,默认是10 进制,[parseInt("1",0),parseInt("2",1),parseInt("3",2)] 按十进制转换输出1 1不在2~36之间,...
2019-08-01 22:46:31
82
原创 js 前端面试题
一、原生js实现一个深拷贝deepclone? 首先要检测当前属性是否为对象,因为数组是特殊的对象,所以,在属性为对象的前提下还需要检测它是否为数组,如果是数组,则创建一个[]空数组,否则,创建一个{}空对象,并赋值给子对象的当前属性。然后,递归调用extendDeep函数。这是使用递归算法实现的一种深度复制方法。ES5新增的JSON对象提供的两个方法也可以实现深度复制,分别是JSO...
2019-07-31 22:23:19
115
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人