- 博客(128)
- 收藏
- 关注
RSS订阅原创 vue实现全选/单选
//未开票单选selectedTap(item, index) { if (typeof item.isChecked == 'undefined') { this.$set(item, 'isChecked', true); } else { item.isChecked = !item.isChecked; } let maxlen = this.notinvoicedList.length; let count = 0; this.notinvoicedLi.
2021-01-18 16:56:38
542
原创 微信相关的登录流程
微信授权登录流程第一步：wx.login获取 用户临时登录凭证code第二步：wx.getUserInfo获取加密过的数据encryptedData和解密参数iv第三步：把步骤一、二中的code、encryptedData、iv传到开发者自己服务端第三步：服务端获取到code、encryptedData、iv之后用get方法请求如下微信接口https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&
2020-08-07 22:54:17
4437
原创 css总结
CSS总结什么是BFC?字面量理解就是块级格式化上下文BFC没有定义只有特性特性1:使BFC内部浮动元素不会乱跑特性2:和浮动元素产生边界css隐藏元素的方法?1.opacity:0;2.visibility:hidden;3.display:none;4.position:absolute;...
2020-08-07 22:38:02
235
原创 字符串截取
function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); //正则匹配 var r = window.location.search.substr(1).match(reg); if (r !=...
2020-04-22 22:06:22
488
原创 2020 面试要记
1.防抖与节流防抖是什么? 触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间实现方式：每次触发事件时设置一个延迟调用方法，并且取消之前的延时调用方法缺点：如果事件在规定的时间间隔内被不断的触发，则调用方法会被不断的延迟方法//防抖debounce代码：function debounce(fn) { let timeout = null; // ...
2020-04-09 22:31:27
233
原创 vue
1、说说你对 SPA 单页面的理解，它的优缺点分别是什么？SPA（ single-page application ）仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成，SPA 不会因为用户的操作而进行页面的重新加载或跳转；取而代之的是利用路由机制实现 HTML 内容的变换，UI 与用户的交互，避免页面的重新加载。优点：用户体验好、快，内...
2019-10-20 21:55:54
410
原创 react
React 面试题以下是面试官最有可能问到的 50 个 React 面试题和答案。为方便你学习，我对它们进行了分类：基本知识 React 组件 React Redux React 路由基本知识1. 区分Real DOM和Virtual DOMReal DOM更新缓慢。 可以直接更新 HTML。 如果元素更新，则创建新DOM。 DOM操作代价很高。 消耗的内存较多...
2019-10-20 21:36:39
346
原创 react相关知识
react的单项数据流:单向数据流过程：简单的单向数据流（unidirectional data flow）是指用户访问View，View发出用户交互的Action，在Action里对state进行相应更新。state更新后会触发View更新页面的过程。这样数据总是清晰的单向进行流动，便于维护并且可以预测。优点：1. 所有状态的改变可记录、可跟踪，源头易追溯;2. 所有数据只有一份，组...
2019-10-20 20:52:44
135
原创 meta总结
什么是meta标签？引自下W3school的定义说明一下。元数据（metadata）是关于数据的信息。标签提供关于 HTML 文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。典型的情况是，meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。标签始终位于 head 元素中。元数据可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关...
2019-10-16 20:45:47
240
原创 requestAnimationFram优势
https://juejin.im/post/5c27105af265da61285a332f利用seTimeout实现的动画在某些低端机上会出现卡顿、抖动的现象。 这种现象的产生有两个原因：setTimeout的执行时间并不是确定的。在Javascript中， setTimeout 任务被放进了异步队列中，只有当主线程上的任务执行完以后，才会去检查该队列里的任务是否需要开始执行，因此 s...
2019-10-16 20:32:29
1880
原创 vue生命周期钩子函数
vue探索 ————八大周期钩子函数首先是官方文档上的图解 下面是执行顺序1，beforeCreate（）：此钩子函数发生在实例创建之前，此时data，el，methods未初始化，观测数据和事件初始化完成，2，created（）：此钩子函数data，methods数据初始化；el未初始化3，beforemount（）：此钩子函数内就运用了dom虚拟技术 即是先占位置 数据不更...
2019-10-13 22:50:10
202
原创 2019 面试题
js中“==”与"==="的区别== 表示相等 （值相等）===表示恒等（类型和值都要相等）js在比较的时候如果是 == 会先做类型转换，再判断值得大小，如果是===类型和值必须都相等js中关于this指向的问题的简单总结1:在全局作用域下 this对象指向的是window对象2:在函数作用域下在非严格模式下: this的指向依旧是window对象在严格模式下:...
2019-10-11 17:44:08
254
原创 vue-devtools的安装与使用
vue-devtools的安装与使用一.在github上下载压缩包，github下载地址：https://github.com/vuejs/vue-devtools二.解压到本地的某盘三.用你的npm中进入该文件夹下四.依次输:1:npm install （如果在这部报错的话，就改用cnpm install。 cnpm需要安装安装地址）2:npm run build...
2019-09-25 22:47:19
157
原创 vue 路由跳转传参
正常跳转this.$router.push('/index');1带参 toOrderDetail() { let orderUuid = this.order.uuid; this.$router.push({path: `/orderDetail/${orderUuid}`}); } 路由配置 path: '/orderDetail/:or...
2019-09-20 18:03:57
217
原创 小程序canvas换行与canvas生成图片分享朋友圈及分享好友
小程序canvas多余文字"..."处理 文字换行显示 分享给好友及朋友圈 保存图片到本地所有的图片均要是https的 先用wx.downloadFile处理到本地 适配可用wx.createSelectorQuery().select('#canvas-container').boundingClientRect(function(rect) {console.log(re...
2019-08-29 11:57:16
568
原创 小程序日历 实现前端展示三个月 上下箭头切换效果
点击选中日期 开始时间和结束时间 类似于酒店入住wxll<view class='wraper'> <view class="list"> <view class="close" catchtap="closetap">X</view> <view class="dateChoose">选择日期<...
2019-08-29 11:30:32
1260
原创 前台页面 弹窗去除域名显示
window.alert = function alertw(name) { var iframe = document.createElement("IFRAME"); iframe.style.display = "none"; iframe.setAttribute("src", 'data:text/plain,'); document.d...
2019-05-30 18:16:09
455
原创 小程序全面屏底部按钮适配
如果你的小程序页面按钮有用fixed定位到底部的话，那你一定会遇到兼容全面屏的坑（与底部横条重叠）。查了下文档，发现能用的就只有一个api：wx.getSystemInfoSync()wx.getSystemInfoSync()封装一个全局的函数代码如下:app.jsonLaunch: function (e) { // 判断设备是否为全面屏 t...
2019-05-29 11:50:20
4953
原创 小程序列表倒计时
适合拼团用的倒计时:通过后端传过来的数据,前端进行处理转换js:data:{ pinkEntityList :[]}getpink:function(){ let that = this; util.request(api.GoodPink, { id: that.data.id}).then(function (res) { //拼团接口 consol...
2019-05-27 18:22:00
665
原创 jsA页面传值 B页面拿取值
法一:A页面:var loc = location.href; var n1 = loc.length;//地址的总长度 var n2 = loc.indexOf("=");//取得=号的位置 var id = decodeURI(loc.substr(n2+1, n1-n2));//从=号后面的内容 alert(id);B页面:location.href="...
2019-05-10 11:58:42
380
原创 小程序getCurrentPages
收货地址address.jsselectAddress(event) { try { wx.setStorageSync('addressId', event.currentTarget.dataset.addressId); wx.setStorageSync('index', event.currentTarget.dataset.index); ...
2019-03-19 11:13:53
2232
原创 使用antd按需加载
使用antd按需加载使用react-app-rewired对 create-react-app 的默认配置进行自定义yarn add react-app-rewired --dev/* package.json */"scripts": {- "start": "react-scripts start",+ "start": "react-app-rewired star...
2018-12-13 18:40:44
1863
原创 Create-react-app+Antd+Less 在项目yarn eject 的情况下进行配置
暴露所有内建的配置(注：我这里用的是yarn)yarn eject注：如果yarn eject 报错的解决的方法git add .git commit -m 'aa'yarn eject 使用babel-plugin-import实现Antd按需加载，并修改package.jsonyarn add babel-plugin-import --save-d...
2018-12-13 17:32:39
394
转载 React 的弹框实现（类 Antd 的 append 到 body）
Modal, PopUP, Toast, ToolTip 等这些都属于弹框。平时我们使用弹框一般有两种方式：一种是通过函数形式弹出，另一种是组件形式弹框。下面我分别对两种弹出方式写了2个 Demo，如果有可以优化的地方，请多多指点。。。函数形式弹出// mask.jsimport React from 'react';import {Button} from 'antd';imp...
2018-11-30 12:11:02
1781
原创 -webkit-user-select: none;导致的移动端input=text 无法输入
解决办法：* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: transparent; outline: none;}*:not(input,textarea)...
2018-11-08 19:23:17
2054
原创 稀疏数组
稀疏数组就是包含从0开始的不连续索引的数组。通常，数组的length属性值代表数组中元素的个数。如果数组是稀疏的，length属性值大于元素的个数。可以用Array()构造函数或简单地指定数组的索引值大于当前的数组长度来创建稀疏数组。a = new Array(5); //数组没有元素，但是a.length是5a = []; //创建一个空数组，length = 0a[1000...
2018-10-22 13:41:07
791
原创 arcTo画边框圆角
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"
2018-10-15 12:20:36
317
原创 js倒计时
var tt = setInterval(function () { dateDown(timeCalc(toTime)) //定义倒计时的结束时间，注意格式 }, 50); //定义计时器，每隔1000毫秒 也就是1秒 计算并更新 div的显示 var cha; var toTime = new Date('2018/05/13 00:00:00'); ////...
2018-09-17 16:59:50
276
原创 小程序表单验证
// 判定输入为非空字符 formSubmit: function (e) { var that = this; var phone = e.detail.value.phone; var vip = e.detail.value.vip; var reg = new RegExp('^(13[0-9]|15[0-9]|17[0-9]|18[0-9])\\d...
2018-08-20 12:26:27
1220
原创 移动端1px边框实现
/*手机端实现真正的一像素边框*/.border-1px, .border-bottom-1px, .border-top-1px, .border-left-1px, .border-right-1px { position: relative; }/*线条颜色 黑色*/.border-1px::after, .border-bottom-1px::after, .border-t...
2018-08-14 15:55:49
639
原创 时间格式化
var util = require('../../utils/util.js');const app = getApp()Page({data: {aftertime:'',timeD:''},onLoad: function (options) {var stringTime = "2018-08-09 17:40:00";var stringTime...
2018-08-10 18:02:36
290
原创 JS 瀑布流
第一步 创建模板首先你的想好，你想要创建几列，然后在body中创建好模板<div id="box"> <ul></ul> <ul></ul> <ul></ul> <ul></ul><
2018-08-07 19:17:43
212
原创 Postman教程
简介:Postman是chrome的一款插件,用于做接口请求测试,无论是前端,后台还是测试人员,都可以用postman来测试接口,用起来非常方便。打开之后如下图所示,左边是项目具体的接口,右上上面是请求链接,请求体,右边下面是具体的响应体添加接口:先选择左边的 "colletions",下边有个带”+”的文件夹点击输入项目名称,点击"create"新建项目成功...
2018-08-06 18:10:57
1169
1
原创 居中一个元素？你会想到啥？包括水平居中，垂直居中，还有水平垂直居中。 如果要再要细分，还要分浮动元素、绝对定位的居中。
第一部分：水平居中1、常规元素的水平居中行内元素、不定宽块级元素：text-align注意：将div#inner 换成 span#inner 效果一样。样式：#outer {text-align:center}<div id='outer'> <div id='inner'>水平居中的元素</div></div>...
2018-08-03 10:41:59
145
原创 神奇的选择器 :focus-within
伪类选择器 :focus-within言归正传，今天要说的就是:focus-within 伪类选择器。它表示一个元素获得焦点，或，该元素的后代元素获得焦点。划重点，它或它的后代获得焦点。这也就意味着，它或它的后代获得焦点，都可以触发 :focus-within。:focus-within 的冒泡性这个属性有点类似 Javascript 的事件冒泡，从可获焦元素开始一直冒泡到根元...
2018-08-02 16:32:42
332
原创 了解 CSS 字体度量，行高和 vertical-align
<p class="p p0"><span class="c">Ba</p> <p class="p p1"><span class="c">Ba</p> <p class="p p2"><
2018-07-31 11:48:04
493
原创 less初学
安装 less$ npm install -g less //全局安装我们现在要编译less文件夹下的 tess.less 文件，编译时需先定位到项目中的less文件目录，然后使用如下命令进行编译，这样就可以将 test.less 文件编译成 test.css 文件了。$ lessc test.less test.css$ lessc test.less test.css...
2018-07-26 17:15:09
206
原创 Transition and Animation
Transition语法 1234567 .example { transition-property: all | none | <custom-ident>; transition-duration: 0s; transition-timing-function: ease | ease-in | ease-out ...
2018-07-26 10:38:22
340
原创 没有webpack.optimize.CommonsChunkPlugin，解决办法。
今天在对着webpack中文指南一点点敲demo，在代码分离这一节遇到了一个报错：在webpack.config.js改了一下代码：//optimization与entry/plugins同级optimization: { splitChunks: { cacheGroups: { commons: { name: "commons", chunks: "initial", min...
2018-07-25 12:01:30
2076
原创 css小技巧
移动端我们在点击页面中的一些图片的时候会出现阴影。处理方法只要给a标签加上a { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none;} padding 的图形绘制 一个元素画出红领巾的“三道杠”.box1 { disp...
2018-07-24 16:47:04
205
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人