前端
关注
分享
扫一扫
旧雨化碧
这个作者很懒，什么都没留下…
展开
-
css圣杯布局、双飞翼布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>圣杯布原创 2021-06-20 01:15:31 · 91 阅读 · 0 评论 -
2021-06-18 js 防抖与节流
节流：在规定的单位时间内，只能有一次触发事件的回调函数执行，如果同一单位之间内某事件被多次触发，只能有一次生效。function pay(){ console.log("aaaa");}function throttle(func,delay){ let timer; return function(){ let context=this; let args=arguments; if(!timer){ //如果原创 2021-06-19 08:24:35 · 140 阅读 · 0 评论 -
2021-06-18图片懒加载
图片懒加载：图片懒加载主要是用来优化网站的加载性能，降低页面的首屏加载时间，对于图片很多的页面，为了加快页面的加载速度，需要在页面未出现在可视区域内的图片先不做加载，等到滚动条将图片滚动到可视区域后在进行加载。图片懒加载的实现思路：页面渲染时将src路径放到自定义属性中去，这样页面加载时图片就不会去请求服务器，当图片滚动到可视区内时，获取它的自定义属性并赋值给src代码实现：html代码：<!DOCTYPE html><html lang="en"><head&原创 2021-06-18 22:03:42 · 122 阅读 · 0 评论 -
2021-06-18 js 深拷贝 浅拷贝
深拷贝和浅拷贝都只针对引用数据类型深拷贝：拷贝多层，可以拷贝对象里的子对象浅拷贝：不可以拷贝对象里的子对象。深拷贝的实现:1:原有的库函数JSON.parse(JSON.stringfy(obj))缺点：函数、正则、undefined 、无法拷贝2.Object.assign(obj2,originalObj)优点：可以拷贝函数、正则、undefinded可以拷贝，缺点：深层次的拷贝是浅拷贝。3.var $ = require('jquery');var obj2 = $.exten原创 2021-06-18 18:24:27 · 112 阅读 · 0 评论 -
2021-06-18 在子元素在父元素位置居中
方法1：使用postion定位.parent{ width: 100px; height: 100px; background-color:pink; position: relative;}.child{ position: absolute; width: 20px; height: 20px; top: 50%; left:50%; margin-top: -10px; margin-left: -10px;原创 2021-06-18 17:14:12 · 74 阅读 · 0 评论 -
2021-06-18 css实现三角形
方法1：.create{ width: 0; height: 0; border:10px solid transparent; border-right-color: tomato;}方法2：使用伪类.s2::after{ content: ""; position: absolute; top: 9px; right: 9px; width: 7px; height: 7px; border-top: 2p原创 2021-06-18 15:50:42 · 93 阅读 · 0 评论 -
函数柯里化
函数柯里化是指把一个接受多个参数的函数变成接受一个参数的函数，并且该函数的返回值也是函数，用于处理其他的参数。经典面试题：add(1)(2)(3)(4)=10add(1)(2,3)(4)=10function add(){ var _args=Array.prototype.slice.call(arguments) var _adder=function(){ _args.push(...arguments) return _adder }原创 2021-05-10 22:22:46 · 83 阅读 · 0 评论 -
跨域jsonp
非路由组件转换为路由组件/*withRouter 高阶组件包装非路由组件，返回一个新的组件新的组件向非路由组件传递三个属性 history /location /match使非路由组件具有路由组件的属性*/export default withRouter(LeftNav)JSONP在同源策略下，在某个服务器下的页面是无法获取到该服务器以外的数据的，但img、iframe、script等标签是个例外，这些标签可以通过src属性请求到其他服务器上的数据。利用script标签的开放策略，原创 2021-05-10 19:01:05 · 91 阅读 · 0 评论 -
React setState
setState:setState是同步方法，引起react后续动作更新状态是异步的，对象式setState.setState(stateObj,callback()),callback,是在更新完状态且render重新渲染之后调用。函数式setStatesetState(updater,callback)其中updater是一个函数，返回值是对象，函数的参数是state和props对象式setState是函数式setState的简写形式。...原创 2021-04-25 11:46:25 · 94 阅读 · 0 评论 -
React withRouter
加工一般组件，让一般组件具有路由组件的特有的API,withRouter返回值是一个新的组件。import React, { Component } from 'react'import {withRouter} from 'react-router-dom' class Header extends Component { back=()=>{ this.props.history.goBack() } forward=()=>{原创 2021-04-22 16:03:34 · 111 阅读 · 0 评论 -
React编程式路由导航
借助路由组件的this.props.history 对象上的API对路由进行跳转、前进和后退。路由组件：接收到三个固定的属性 history: go: ƒ go(n) goBack: ƒ goBack() 后退 goForward: ƒ goForward() 前进 push: ƒ push(path, state) 压栈， replace: ƒ replace(path, state) 替换栈顶元素原创 2021-04-22 14:54:55 · 315 阅读 · 0 评论 -
React 向路由组件传递参数
1.通过params参数，参数在地址栏体现在路由链接里面携带参数<Link to=‘/home/home_message/detail/1/message1’}>消息1</Link>在注册路由的时候声明接受参数在路由组件中接收参数：2.向路由组件传递search参数，参数在地址栏体现了配置路由链接：<Link to={`/home/home_message/detail/?key=value&key=value`}>详情</Link>原创 2021-04-22 10:39:01 · 276 阅读 · 1 评论 -
Promise和Async/await的理解和使用
一、前置知识1.1 区别实例对象与函数对象实例对象：new 函数产生的对象, 称为实例对象, 简称为对象。函数对象： 将函数作为对象使用时, 简称为函数对象function Fn() {}const fn = new Fn() // fn为实例对象Fn.bind({}) // Fn为函数对象1.2 两种类型的回调函数同步回调理解：立即执行, 完全执行完了才结束, 不会放入回调队列中例子: 数组遍历相关的回调函数 / Promise 的 excutor 函数异步回调理解：不会立即执行翻译 2021-04-21 10:05:05 · 366 阅读 · 0 评论