![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 67
Mr.Hu.
这个作者很懒,什么都没留下…
展开
-
解决微信小程序bindgetphonenumber和wx.login获取的code不同步问题
在获取用户手机号的时候,经常会因为提交参数的code和iv、encryptedData参数匹配不一致而报错。原创 2023-06-19 17:45:49 · 1442 阅读 · 0 评论 -
UniApp-Vue3踩坑记录&心得体会
开发时路径:编译后路径:引用路径:如上1.1图示。只能让它作用的背景变模糊,当有元素拖动到它下面时,不会模糊下面的元素。仅仅是当前背景变模糊。这个属性可以让你为一个元素后面区域添加图形效果(如模糊或颜色偏移)。 因为它适用于元素背后的所有元素,为了看到效果,必须使元素或其背景至少部分透明。很多时候我们需要动态渲染某些“选中”、“切换”、“不同状态”等样式或者需要计算才能得到的样式,这时候我们就可以使用Vue3的状态驱动的动态css——v-bind效果:父组件:子组件:在谷歌浏览器>扩展程序 里面添加http原创 2022-06-28 15:53:17 · 3199 阅读 · 2 评论 -
h5在iOS上,回退页面,出现白屏,滑动页面,页面正常展示
问题:h5在iOS上,回退页面,出现白屏,滑动页面,页面正常展示scrollRestoration描述:h5在ios上,第一个页面超过一屏,点击进入第二个页面,第二个页面滑动超过一屏时,返回第一个页面时,第一个屏幕有一块白的盖在上面,滑动页面,白屏消失,页面正常展示。这块白的是第二个页面滚动的部分,盖在第一个屏幕上了。解决方法:window.history.scrollRestoration会记录上一个页面滚动的位置。值:auto,将恢复用户已滚动到的页面上的位置; manual,未还原页上的位置。转载 2022-01-19 16:57:06 · 1301 阅读 · 1 评论 -
2021中高级前端面试题及解析
1.对闭包的看法,为什么要用闭包?说一下闭包原理以及应用场景1)什么是闭包函数执行后返回结果是一个内部函数,并被外部变量所引用,如果内部函数持有被执行函数作用域的变量,即形成了闭包。可以在内部函数访问到外部函数作用域。使用闭包,一可以读取函数中的变量,二可以将函数中的变量存储在内存中,保护变量不被污染。而正因闭包会把函数中的变量值存储在内存中,会对内存有消耗,所以不能滥用闭包,否则会影响网页性能,造成内存泄漏。当不需要使用闭包时,要及时释放内存,可将内层函数对象的变量赋值为null。2)闭包原理函转载 2021-05-25 23:08:42 · 2502 阅读 · 1 评论 -
js 原型的之—— Object 和 Function 的关系
var F = function(){};Object.prototype.a = function(){};Function.prototype.b = function(){};F既能访问到a,也能访问到b(Object 和 Function也同样, 但是所有的实例只能访问到a),F是Object 和 Function两个的实例, 那么 Object 和 Function 到底是什么关系?这是我对 Object 和 Function 的了解F instanceof Object //true转载 2021-05-24 23:53:48 · 514 阅读 · 0 评论 -
JavaScript高级程序设计之——递增/递减操作符的前缀版和后缀版
在javascript的语法里,我们把只操作一个值的操作符称为一元操作符。这里我将针对一元操作符里面的递增操作符和递减操作符做一下详细介绍。1.前缀操作符顾名思义,前缀操作符就是位于要操作的变量前头。前缀递增操作符会给数值加1,把两个加号放到变量前面即可:let age = 29;++age;在这个例子中,前缀递增操作把age的值变成了30(给之前的值29加1)。因此,它实际上等于如下表达式:let age = 29;age = age + 1;前缀递减也类似,只不过是从一个数值减1。使原创 2021-04-17 22:31:56 · 261 阅读 · 0 评论 -
基于Vue的SPA如何优化页面加载速度
基于Vue的SPA如何优化页面加载速度常见的几种SPA优化方式 减小入口文件体积 静态资源本地缓存 开启GZip压缩 使用SSR ..... 减小入口文件体积,常用的手段是路由懒加载,开启路由懒加载之后,待请求的页面会单独打包js文件,使得入口文件index.js变小,开启懒加载之后,js是这样请求加载的: 2. 静态文件本地缓存有两种方式 HTTP缓存,设置Cache-Control,Last-Modified,Etag等响应头,很多文章讲的转载 2021-03-16 23:04:56 · 161 阅读 · 0 评论 -
微前端
一、微前端的概念将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的小块,而在用户看来仍然是内聚的单个产品。二、微前端的特点简单来讲,微前端的理念类似于微服务:将庞大的整体拆成可控的小块,并明确它们之间的依赖关系。关键优势在于:代码库更小,更内聚、可维护性更高松耦合、自治的团队可扩展性更好渐进地升级、更新甚至重写部分前端功能成为了可能1.简单、松耦合的代码库比起一整块的前端代码库,微前端架构下的代码库倾向于更小/简单、更容易开发。此外,更重要的是避免模块间不合理的隐式耦合造成的转载 2021-03-09 22:12:58 · 299 阅读 · 0 评论 -
2021Web前端中高级面试题复盘
一、js基础1.call、apply、bind三者的用法和区别(1)三者的使用func.call(thisArg, arg1, arg2, ...)func.bind(thisArg, arg1, arg2, ...)func.apply(thisArg, [arg1, arg2, ...]) (2)手写call()方法Function.prototype.myCall = function(thisArg, ...args) { thisArg.fn = this原创 2021-03-06 22:32:24 · 7889 阅读 · 0 评论 -
常用的CSS默认样式
以下是个人习惯性用的css reset 重置浏览器默认样式,在这里立个flag,有需要的同仁可以直提@charset "gb2312";body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li,pre, form, fieldset, legend, button, input, textarea, th, td {margin: 0;padding: 0}body, button, input, selec原创 2021-03-03 21:31:39 · 1345 阅读 · 1 评论 -
vue常见面试题
1.vue优点?答:轻量级框架:只关注视图层,是一个构建数据的视图集合,大小只有几十kb;简单易学:国人开发,中文文档,不存在语言障碍 ,易于理解和学习;双向数据绑定:保留了angular的特点,在数据操作方面更为简单;组件化:保留了react的优点,实现了html的封装和重用,在构建单页面应用方面有着独特的优势;视图,数据,结构分离:使数据的更改更为简单,不需要进行逻辑代码的修改,只需要操作数据就能完成相关操作;虚拟DOM:dom操作是非常耗费性能的, 不再使用原生的dom操作节点,极大解放d转载 2021-02-23 22:45:51 · 216 阅读 · 0 评论 -
js判断ie版本及是否是IE环境
有时候因为开发需要,我们的项目需要针对ie浏览器做单独的适配,这是我们就需要用到一些比较特殊的手段。这种情况我们首先既要保证正常浏览器(如谷歌、火狐、360、QQ等等)样式又要保证ie浏览器的样式,所以大多时候采用的解决方案是编写两套样式,这里我们简要举例说明一下一般的解决方案:1、项目方案–引入两套css在ie9以下浏览器环境里面,可以识别一个css判断代码,引用这段代码就意味着所引入的样式只在ie9以下的环境中生效,这样的话就可以让我们做到对ie9以下的版本做两套代码的适配: <scrip原创 2021-01-11 10:40:48 · 544 阅读 · 4 评论 -
简述http和https区别
http协议和https协议的区别主要是:传输信息安全性不同、连接方式不同、端口不同、证书申请方式不同一、传输信息安全性不同http协议:是超文本传输协议,信息是明文传输。如果攻击者截取了Web浏览器和网站服务器之间的传输报文,就可以直接读懂其中的信息。https协议:是具有安全性的ssl加密传输协议,为浏览器和服务器之间的通信加密,确保数据传输的安全。二、连接方式不同http协议:http的连接很简单,是无状态的。https协议:是由SSL+HTTP协议构建的可进行加密传输、身份认证的网原创 2020-10-29 09:54:57 · 5375 阅读 · 2 评论 -
前端经典面试题:从输入URL到页面加载发生了什么?
总体来说分为以下几个过程:1. DNS解析2. TCP连接3. 发送HTTP请求4. 服务器处理请求并返回HTTP报文5. 浏览器解析渲染页面6. 连接结束具体过程DNS解析DNS解析的过程就是寻找哪台机器上有你需要资源的过程。当你在浏览器中输入一个地址时,例如www.baidu.com,其实不是百度网站真正意义上的地址。互联网上每一台计算机的唯一标识是它的IP地址,但是IP地址并不方便记忆。用户更喜欢用方便记忆的网址去寻找互联网上的其它计算机,也就是上面提到的百度的网址。所以互联网设计者转载 2020-10-28 14:29:45 · 1388 阅读 · 0 评论 -
前端项目兼容ie浏览器踩坑总结
问题:ie9以下,input事件失效解决方案:通过给dom绑定onpropertychange来替换原有的事件注:(1)onpropertychange事件是专门在ie浏览器里面生效的,所以input的原有事件与其并不冲突;(2)onpropertychange事件是在input对象改变任何属性时都会触发;(3)onpropertychange事件只能通过dom绑定事件。实现代码如:<input type="text" class="form-control" id="replyDay.原创 2020-10-21 15:47:25 · 949 阅读 · 2 评论 -
前端vue2.0相关干货全面讲解
前端vue2.0相关干货全面讲解https://www.jianshu.com/p/72018b6601ce转载 2020-09-18 17:05:28 · 94 阅读 · 0 评论 -
利用Electron将web页面打包成电脑桌面程序
1.从github上克隆项目至本地打开终端,输入以下命令:git clone https://github.com/electron/electron-quick-startcd electron-quick-startnpm installnpm start2.修改默认配置参数可根据你的需求,对项目中的一些参数进行修改,如:设置应用显示窗口大小、隐藏菜单栏、隐藏边框、设置窗口是否拖动等等详细参考官方文档3.进行打包(1)安装打包工具 electron-packager:np原创 2020-05-09 16:32:24 · 925 阅读 · 0 评论 -
h5页面在ios端输入框不能自动聚焦
我们在写h5页面嵌套在原生app里面的时候,有时候会遇到进入某个页面就让input输入框自动聚焦的需求(比如搜索页面)。但是通常在iso手机上会出现自动聚焦没反应的情况。然后我在网上试验过各种解决方案,基本都是无效的。最终和ios开发人员联调得出结果,在ios12系统以上版本,苹果端考虑到用户的安全性和体验方面的因素,是不支持input框自动聚焦属性的!然后,最终的解决方案是:1. 在inp...原创 2020-04-17 12:42:34 · 5560 阅读 · 2 评论 -
ios键盘弹出之后页面页面会被强制滚动消失
ios键盘弹出之后页面页面会被强制滚动消失ios在h5输入框聚焦之后,通常键盘弹起之后再滑动页面就会出现页面内容消失在顶部的问题。实际上解决方案不能从css布局方案考虑,因为这是ios系统的一个特性,所以我最终通过尝试得到的完美解决方案是:window.ontouchmove = function() { $('input').blur(); };通过监听页面滚...原创 2020-04-17 12:19:54 · 987 阅读 · 0 评论 -
创建一个github项目并且将本地代码添加到远程仓库
1.选择一个需要添加到git的本地项目,然后右键,选择“Git Bah Here”。2.输入初始化命令:git init3.在项目里面新建一个文件4.将本地文件添加至暂存区,输入命令:git add .5.将暂存区的文件提交值本地仓库,输入命令:git commit -m "first commit"5.将本地仓库同步至远程仓库(1)在github上新建一个项目...原创 2020-03-18 16:30:59 · 343 阅读 · 0 评论 -
生成本机SSH key,并添加到github上
1.打开控制台,输入命令:ssh-keygen -t rsa -C "你的github邮箱号"2.连续三次回车,出现以下提示3.找到.ssh文件夹,并打开其中的id_rsa.pub文件,复制里面的内容4.登录GitHub官网,打开设置,点击SSH and GPG keys5.填写你的ssh名字,并且输入你刚才复制的ssh key,点击Add SSH key6.测试你的ssh是...原创 2020-03-18 15:50:19 · 579 阅读 · 1 评论 -
css3动画——wow.js详解(可达到页面滚动至对应区域时执行动画的效果)
【演示及下载地址】http://www.dowebok.com/131.html【案例解析】下篇文章我将通过具体案例解析wow.js用法,具体效果在文档里做了标明【用法】 在做项目中,有时需要做到滚动条滑到某个位置时,才能显示动画,wow.js插件可以很好的解决问题 下面说明一下怎么使用这个插件:1、wow.js依赖于animate.css,首先在头部引用animate.cs...转载 2020-03-18 11:23:06 · 1151 阅读 · 0 评论 -
新建一个vue cli项目
- 一、新建一个vue cli项目1、用webStorm或者phpstorm直接新建一个vue.js项目,步骤如下: (1)打开软件,点击 NEW PROJECT (2)输入你的工程名,然后点击CREAT (3)配置NPM,点击这个图标- 二、用cmd命令新建一个项目 1、打开运行,cmd工具 2、打开npm服务(1)搭建VUE CLI环境,输入npm install -...原创 2020-02-29 15:31:45 · 111 阅读 · 0 评论 -
Koa-generator安装与使用
Koa-generator安装与使用点击电脑开始,输入cmd,打开命令工具输入npm,打开npm工具输入 npm install -g koa-generator 安装 koa-generator 脚手架输入 koa2 -e koa2-learn ,创建一个koa2项目, koa2-learn 即是koa2的项目名输入 cd koa2-learn ,打开koa...原创 2020-02-29 15:21:52 · 1051 阅读 · 0 评论 -
安装nuxt.js环境
安装nuxt.js环境打开终端输入以下命令:继续输入以下命令3.最终打开浏览器,访问http://localhost:3000/,出现以下内容,那么说明你已经安装成功了...原创 2020-02-29 14:25:08 · 337 阅读 · 1 评论 -
uni.request请求问题(解决请求接口参数跟在地址栏后面成功放在data里面请求不成功的问题)
uni.request请求问题(解决请求接口参数跟在地址栏后面成功放在data里面请求不成功的问题)在请求接口的时候,发现network里面显示如图:这时查看uni.request请求,首先看请求方法是不是post,然后再看是否加了请求头,若没有则加上:,再请求一遍,打开浏览器查看network里面,请求成功。...原创 2019-10-17 09:36:24 · 9788 阅读 · 3 评论