- 博客(23)
- 收藏
- 关注
RSS订阅原创 vue3+ts添加公共富文本组件
vue3+ts添加公共富文本组件下载npm install wangeditor --save-dev复制代码新建一个editor.vue 的组件<style scoped>.part_right { width: 100%; background: #f2f2f2; min-height: 100vh;}.list { width:96%; margin: 0 auto; /* background: gray; *
2021-07-19 16:11:10
835
原创 vue3九宫格抽奖
下载npm install qdleader-cj在mian.js中引入import plug from 'qdleader-cj'import 'qdleader-cj/lib/plugin.css'createApp(App) .use(plug) .mount('#app')在组件中使用<drawBox /> 就是要引入的组件<template> <div class="list"> <drawBo
2021-02-25 17:57:37
249
原创 微信授权没搞过？
微信公众号号的网页授权vue的具体实现。没搞过的同学可以先看看官方的文档https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html我在这里提供一个授权的可选方案，供大家参考，有不妥之处欢迎指正。我这个项目有个需求，是可以在首页，个人中心页面等多个页面都要进行判断如果用户没有登录，那么就弹出微信授权页面，让用户点授权。所以我们本着能‘偷懒就偷懒原则’。封装一个公用组建
2020-06-21 21:40:52
279
原创 简单化最小化语句数
js的语句数量也影响所执行的操作速度。完成多个操作的单个语句要比完成单个操作的多个语句要快。简写这方方面面的我可以给你几条建议。1.多个变量声明var count = 5; var color = 'blue'; var now = new Date();可以简写为var count = 5, color = 'blue', now = new Date();...
2020-06-12 15:41:35
151
原创 css3图片防变形
1.object-fit由于图片原始大小都不一样,强行设定大小值会导致拉伸,如果不设定大小则参差不齐。 之前我们大多数用的大多数都是利用background-size: cover 来避免对图片造成的压缩或者拉伸。fill: 默认值,和未设置一样。使图片拉伸填满整个容器, 不保证保持原有的比例。contain: 当宽/高的值达到父容器规定的最小宽/高时,则对应的另一个值会按照原始宽高比进行生成。由于是保证整个图片都可以出现在容器中。因此，此参数可能会在容器内留下空白cover:
2020-06-08 11:38:01
435
原创 公众号使用微信sdk的正确姿势
当我们做微信登录授权，微信公众号的分享，微信的h5支付等等等等的时候难免会用到微信sdk，当我们用react或vue做的spa应用，直接引入后会发现，在按安卓上可以正常调试，而ios上一直报签名错误（但你发现你刷新一下又可以了。。），等各种问题。在我连连续续踩了各种坑之后，含泪写此文。。。闲话不多说，上代码！（再说一句句，希望获取前端进步的可以关注下qdleader）引入sdk首先在main.js中引入// 每次切换路由时候，注册config(并解决ios的兼容问题)import { bUr
2020-05-24 11:39:57
1706
原创 es6手写一个call
Function.prototype.selfCall = function(ctx, ...args) { if(typeof this !== 'function') { throw new Error('you must use call with function') } ctx = ctx || window //强绑定上ctx为执行上下...
2020-03-30 17:41:56
174
原创 同学给我来个手写的new吧
1.手写一个new首先看看new怎么用function Person（name）{ this.name = name}Person.prototype.eat = function() { console.log("Eating")}var qd = new Person('qd')console.log(qd)qd.eat(); 使用new创建的实...
2020-03-30 17:41:46
116
原创 this绑定番外篇之箭头函数绑定
我们在前几章说this永远指向最后调用它的那个对象。 但对于箭头函数来说不是的，它里面的this是由外层作用域来决定的，且指向函数定义时的this而非执行时。它里面的this是由外层作用域来决定的怎么理解呢？首先箭头函数中没有 this 绑定，必须通过查找作用域链来决定其值，如果箭头函数被非箭头函数包含，则 this 绑定的是最近一层非箭头函数的 this，否则，this 为 undefine...
2020-03-30 17:41:27
221
原创 this综合篇
var name = 'window'var person1 = { name: 'person1', foo1: function () { console.log(this.name) }, foo2: () => console.log(this.name), foo3: function () { return function () { ...
2020-03-30 17:40:14
84
原创 vue中引入公用过滤器？
比如我们封装一个金钱的过滤器：不废话，直接上代码在main.js平级新建filter文件夹，里面新建index.js和money.jsindex.jsimport { moneyP} from './money'export default moneyP;注意这里不要用module.exports导出了，会报错。/...
2020-03-30 17:35:12
256
原创 this详解下
3.显示绑定： （使用某些方法，改变函数内部的this的指向。） 通过call(),apply()或bind方法直接指定this绑定的对象，如foo.call(obj).注意： 使用.call()或者.apply执行的函数是会直接执行的。 bind（）是创建一个新的函数。需要手动调用才会执行。 .call()和。apply用法基本类似。不过call接受若干个参数，而apply接受的是一个数组。...
2020-03-30 17:34:28
160
原创 012天this详解上
我们知道，this对象在运行时基于函数的执行环境绑定的：在全局函数中，this等于window，而当this某个对象的方法调用时，this等于那个对象。1. this的绑定形式 1.默认绑定 2.隐式绑定 3.显示绑定 4.英绑定 5.new绑定2.五种绑定的优先级默认绑定 < 隐式绑定 < 显示绑定 < 硬绑定 < ...
2020-03-22 13:08:18
102
原创 011天之跨域资源共享CORS
通过XHR实现Ajax通信的一个主要限制，来源于跨域安全策略，默认情况下XHR对象只能访问与包含它的页面位于同一个域中的资源。这种安全策略可以预防某些恶意行为。但是，实现合理的跨域请求对于开发某些浏览器的应用也是非常important的。CORS（Cross-Origin Resource Sharing,跨域资源共享）是w3c的一个工作草案，定义了在必须访问跨域资源时，浏览器和服务器应该如何...
2020-03-22 13:07:16
90
原创 010天JSON.stringify()详解
JSON.stringify()除了要序列化的js对象外，还可以接受另外两个参数，这两个参数用于指定以不同的方式序列化js对象。第一个参数是个过滤器，可以是一个数组，也可以是一个函数；第二个参数是一个选项，表示是否在JSON字符串中保留缩紧。单独或组合使用这两个参数，可以更全面深入地控制JSON的序列化。1.过滤结果如果过滤器参数是数组，那么JSON.stringify()的结果中将只包含...
2020-03-22 13:06:19
161
原创 009天之跨浏览器的事件处理程序
为了以️跨浏览器方式处理事件，我们可以使用一些可以隔离浏览器差异的js库。由于业务需求，有时候我们需要写一些我们自己封装一些兼容代码。比如创建一个addHandler(),它的职责是视情况分别使用DOM0级方法，DOM2级方法或IE方法来添加事件。然后addHandler()方法接受三个参数：要操作的元素，事件名称，和事件处理程序函数。与addHandler();对应的方法是removeH...
2020-03-22 13:05:30
127
原创 使用XHR上传文件要不要了解一下？
上传文件 我们通过File API 能够访问到文件内容，然后把文件内容放到send（）方法中，再通过POST请求，的确很容易就能实现上传。但这样做传递的是文件内容，因而服务器还得收集提交的内容，然后保存到另外一个文件中。其实，更好的做法是以表单提交方式来上传文件。表单方式上传？没错！formData类型做这个很容易，分分钟几千万上下啦。 首先，要创建一个FormData对象，通过它调用appe...
2020-03-22 13:04:24
763
原创 高级函数之作用域安全的构造函数
构造函数都知道。就是一个使用new操作符调用的函数。当使用new 调用时，构造函数内用到的this对象会指向新创建的对象实例。function Person(name,age,job) { this.name = name; this.age = age; this.job = job;}let person = new Person('yk',27,'softw...
2020-03-22 13:01:19
136
原创 学会使用高级函数的安全类型检测
js内置的类型检测机制并非完全可靠，比如typeof操作符，safari直到第四版在对正则表达式应用typeof操作符时会返回function，因此很难确定某个值到底是不是函数。再比如instanceof操作符在在存在多个全局作用域（像一个页面包含多个frame）也是问题多多。比如let isArray = value instanceof Array;以上代码要返回true，v...
2020-03-22 13:00:18
101
原创 web离线应用前提之离线检测
离线web应用就是，设备不能上网情况下仍可以运行的应用。 开发离线应用需要几个步骤，首先确保知道设备能否上网，以便下一步执行正确的操作。然后应用还能访问一定的资源（图像，css，js），之后这样才能正常工作，最后必须有一块本地空间用于保存数据，无论能否上网都不影响读写。离线检测：navigator.onLine属性，true表示能上网，false表示设备离线。支持的浏览器 i...
2020-03-22 12:58:46
666
2
原创 咦？浏览器又崩了？再试试这个呢！
由于连续进行过多的dom操作，有时候会导致浏览器运行崩溃，尤其是在ie中使用onrise事件处理的程序中有dom操作，高频的修改可能会导致浏览器崩溃，为了绕开这个问题，可以用定时器对函数进行节流。当别人问你，同学说一下函数节流吧？你可以告诉他，某些代码不可以在没有间断的情况连续重复执行。第一次调用函数，创建一个定时器，在指定的时间间隔之后运行代码，当第二次调用该函数时，他会清除第一次的定时...
2020-03-22 12:56:35
251
原创 页面太卡了？试试这方法呢！
你写的代码导致浏览器运行奔溃，或页面卡住了，卡死了，怎么办？你可以试试定时器的一个方法，叫做数组分块。脚本长时间运行的问题通常由两个原因造成的：1.过长或过深的函数调用2.进行大量处理的循环。长时间循环通常遵循下面模式```for(let i = 0,len = data.length; i < len; i ++) {process(data[i])...
2020-03-22 12:55:10
282
原创 定位_09_12
position的值,relative和absolute分别是相对于谁进行定位的?absolute: 生成绝对定位元素,相对于最近一级的 定位不是static的父级元素进行定位的.fixed(老ie不支持)生成绝对定位的元素,通常相对于浏览器窗口或frame进行定位relative 生成相对定位的元素,想对于其在普通流中的位置进行定位static 默认值.没有定位,元素穿现在正常...
2018-09-12 15:45:31
93
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人