3 一月清辉

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 2w+

react中组件间3种通信方式----redux、props、订阅发布

1. 方式一: 通过props传递1). 通过props可以传递一般属性和函数属性,2). 一般属性–>父组件向子组件3). 函数属性–>子组件向父组件通信4). 缺点:只能一层一层传递/兄弟组件必须借助父组件2. 方式二: 消息订阅(subscribe)-发布(publish)机制1). 实现库: pubsub-js2). 组件A: 发布消息(相当于触发事件)3). 组件B: 订阅消息, 接收消息, 处理消息(相当于绑定事件监听)4). 优点: 对组件关系没有限制3. 方式

2020-10-30 11:16:46

前端安全

CSRF攻击1. 什么是CSRF攻击CSRF即Cross-site request forgery(跨站请求伪造),是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法。假如黑客在自己的站点上放置了其他网站的外链,例如www.weibo.com/api,默认情况下,浏览器会带着weibo.com的cookie访问这个网址,如果用户已登录过该网站且网站没有对CSRF攻击进行防御,那么服务器就会认为是用户本人在调用此接口并执行相关操作,致使账号被劫持。2. 如何防御CSRF攻击1.验

2020-10-29 20:05:23

你有对 Vue 项目进行哪些优化

1、Vue层面的优化1).v-if 和 v-show 区分使用场景2). computed 和 watch 区分使用场景3). v-for 遍历必须为 item 添加 key,且避免同时使用 v-if4). 数据量较大的列表,做分页5). 事件的销毁6). 图片资源懒加载7). 路由懒加载8). 第三方插件的按需引入9). 服务端渲染 SSR or 预渲染2、代码层面的优化1). Webpack 对图片进行压缩2). 减少 ES6 转为 ES5 的冗余代码3). 提取公共代码4)

2020-10-29 17:09:43

Vue祖孙组件之间的通信---------$attrs、$listeners详解

$attrs功能:实现当前组件的父组件向当前组件的子组件通信说明:$attrs是一个对象,包含了当前组件的父组件传递给当前组件的所有的属性绑定 (当前组件props声明的属性除外、父组件上绑定的class 和 style 除外)编码//parent.vue 当前组件的父组件<SonComponent class="box" text="1组件" ></SonComponent> //son.vue 当前组件<GrandSonComponen

2020-10-29 11:34:44

Vue之-------css深度作用选择器 >>> 、/deep/ 、::v-deep

css深度作用选择器的作用如果使用了scoped后,无法修改第三方UI组件库组件的样式,这里可以使用css深度作用选择器,以作样式修改。例:vue项目中,经常需要使用如elementUI等组件库,有些样式直接在组件中修改无效,因为scoped局限于当前组件,去掉scoped的话又会影响全局样式。针对这种情况,可以使用深度作用选择器(即样式穿透)。具体用法1、如果项目使用的是css原生样式,那么可以直接使用 >>> 穿透修改<style scoped> /*编译前*

2020-10-27 18:33:23

说说你对 SPA 单页面的理解,它的优缺点分别是什么?

SPA 单页面 是什么SPA( single page application )仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成,SPA 不会因为用户的操作而进行页面的重新加载或跳转;而页面的变化是利用路由机制实现 HTML 内容的变换,避免页面的重新加载。优点1). 用户体验好,内容的改变不需要重新加载整个页面,避免了不必要的跳转和重复渲染;2). 减少了不必要的跳转和重复渲染,这样相对减轻了服务器的压力;3). 前后端职责分离

2020-10-26 20:43:24

jQuery最核心的3个问题

1. jQuery整体理解1、jQuery是一个功能强大的函数库, 封装了以下功能(1)、DOM操作(2)、DOM事件处理(3)、ajax请求(4)、各种小的工具函数2、核心语法(1)、jQuery核心函数(2)、jQuery核心对象3、特点:(1)、链式调用(2)、读写合一(3)、更好的浏览器兼容性2. jQuery核心函数1、是什么?就是jquery库向外暴露的$和jQuery, 一般都用$2、它有2种使用方式(1) 作为函数使用(2) 作为对象使用3、$作为函数

2020-10-26 19:28:49

浏览器缓存与渲染机制(回流、重绘、缓存)

1、浏览器缓存位置和优先级Service WorkerMemory Cache(内存缓存)Disk Cache(硬盘缓存)Push Cache(推送缓存)以上缓存都没命中就会进行网络请2、说说不同缓存间的差别Service Worker是独立的线程,我们可以在这个线程中缓存文件,在主线程需要的时候读取这里的文件,Service Worker使我们可以自由选择缓存哪些文件以及文件的匹配、读取规则,并且缓存是持续性的Memory Cache即内存缓存,内存缓存

2020-10-26 19:09:14

ajax请求

1、原生 AJAX 请求处理创建 XMLHttpRequest 对象,也就是创建一个异步调用对象创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL及验证信息设置响应 HTTP 请求状态变化的函数发送HTTP 请求获取异步调用返回的数据使用 JavaScript 和 DOM 实现局部刷新2、同步请求和异步请求的区别同步:浏览器访问服务器请求,用户等待请求完,页面刷新,新内容出现,用户看到新内容,进行下一步操作异步:浏览器访问服务器请求,用户正

2020-10-24 20:24:32

常见的手写代码(深拷贝函数、手写axios函数、自定义事件总线、自定义消息订阅与发布、手写Promise、多维转一维数组)

手写call() , 与手写apply()一致/* 自定义函数对象的call方法*/export function call (fn, obj, ...args) { // 如果传入的是null/undefined, this指定为window if (obj===null || obj===undefined) { obj = obj || window } // 给obj添加一个方法: 属性名任意, 属性值必须当前调用call的函数对象 obj.tempFn = fn

2020-10-24 17:03:24

Web移动端面试常见问题汇总以及参考链接

1、移动端click 300毫秒延迟原因移动端浏览器会有一些默认的行为 ,比如双击缩放、双击滚动,而在用户对页面进行操作的时候,移动端浏览器会优先判断用户是否要触发默认的行为。

2020-10-24 15:23:41

Less,Sass,Styus三者的区别

Less,Sass,Styus三者的区别:1. 变量1). Sass声明变量必须是『$』开头,后面紧跟变量名和变量值,而且变量名和变量值需要使用冒号:分隔开。2). Less 声明变量用『@』开头,其余等同 Sass。3). Stylus 中声明变量没有任何限定,结尾的分号可有可无,但变量名和变量值之间必须要有『等号』。2. 作用域1). Sass:三者最差,不存在全局变量的概念2). Less:最近的一次更新的变量有效,并且会作用于全部的引用!3). Stylus:Sass 的处理方式和

2020-10-24 14:28:59

高德地图的轨迹巡航

1、index.html中引入<script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>2、vue组件实现如下<template> <div id="map_container"> <div id="map_test"></div> <div id="btn_pos"> <button

2020-10-23 18:08:08

Vue引入高德地图

方法一、直接引入法1.第一步. script引入的方式,引入到index.html中高德地图AMap,一般只需引入这个即可<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=自己申请的key"> </script>高德地图Loca,用于数据3D可视化作品绘制<script src="https://webapi.amap.com/loca?key=您

2020-10-23 15:58:44

flex布局 三个div 两个左对齐 一个右对齐

一、问题有一个盒子flex布局,子元素有 三个div,在不改变dom结构的情况下,实现 前两个左对齐 第三个右对齐。二、实现方案在flex布局中如果某个元素的margin为auto,那么它的margin将会自动填充为 剩下的空间。三、代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>flex布局</title>

2020-10-23 14:45:12

CSS3 超实用属性:pointer-events (可穿透图层的鼠标事件)

1、是什么pointer-events 直译为指针事件,该属性指定在什么情况下某个DOM可以成为鼠标事件的 target。简而言之,就是允许/禁止DOM的鼠标事件(click事件、hover事件、mouse事件等鼠标事件)2、具体属性分析用法分析:pointer-events: auto | none | visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | allauto ---

2020-10-23 11:50:19

window.requestAnimationFrame()的初步学习

1、说明window.requestAnimationFrame(func) 这个方法接受一个函数为参数,该函数会在浏览器下一次重绘前调用,开发人员可以用这个特性结合递归来更好的操作动画。参数该方法需要传入一个回调函数作为参数,该回调函数会在浏览器下一次重绘之前执行。返回值返回一个 long 整数,请求 ID ,是回调列表中唯一的标识。你可以传这个值给 window.cancelAnimationFrame() 以取消回调函数。2、使用方法var globalID, k = 2;fun

2020-10-21 10:40:11

postman请求如何设置Content-type为application/json

1、第一步,设置Content-Type注意:请求头与返回头的Content-Type要保持一致2、第二步,设置json格式的参数

2020-10-20 14:42:46

强缓存和协商缓存区别和过程

1、强缓存(本地缓存)1.1. 概念直接使用本地的缓存,不用跟服务器进行通信1.2. 相关header字段expires一个未来时间,代表请求有效期,没有过期之前都使用当前请求。cache-controlno-cache:不使用本地缓存。向浏览器发送新鲜度校验请求pubilc:任何情况下都缓存(即使是HTTP认证的资源)private:只能被终端用户的浏览器缓存,不允许CDN等中继缓存服务器对其缓存no-store:禁止浏览器缓存数据,也禁止保存至临时文件中,每次都重新请求,多次

2020-10-19 19:24:13

浏览器数据存储方式总结

1、cookie1.1、cookie的作用说到cookie,其实cookie有两个主要功能,用于解决http无状态的缺点,在客户端存储会话信息,记录用户的状态也就是我们现在也经常使用cookie在客户端存储一些数据1.2、cookie的构成一般来说,cookie是由浏览器保存的以下几块信息构成的(1)名称:一个唯一确定cookie的名称(2)值:存储在cookie中的字符串值,值必须被URL编码(3)域:cookie对于哪个域是有效的,所有向该域发送的请求都会包含这个cookie信息

2020-10-19 18:29:46

查看更多

勋章 我的勋章
  • 签到新秀
    签到新秀
    累计签到获取,不积跬步,无以至千里,继续坚持!
  • 技术圈认证
    技术圈认证
    用户完成年度认证,即可获得
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv2
    勤写标兵Lv2
    授予每个自然周发布4篇到6篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。
  • 1024勋章
    1024勋章
    #1024程序员节#连续参与两年活动升级勋章,当日发布原创博客即可获得