- 博客(67)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 JS this指针详解
js 中this 关键字很常见，但是它似乎变幻莫测，让人抓狂。他代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。这句话看似平常，可是要非常注意三个字：“运行时”，这就说明this关键字只与函数的执行环境有关，而与声明韩晶没有关系。也就是这个this到底代表的什么对象要等到函数运行时才知道，有点类似函数定义时的参数参数看i额表旨在函数调用时才传入真正的对象。理解了一直点对后面this关键字规律的掌握有很大的帮助。this关键字虽然会根据环境变化，但是它始终指向的时调用当前函数的哪个对象。这就
2021-07-02 11:49:55
275
原创 webpack funck bundle Loader Plugin 打包过程
webpack 支持 esmodule commonjs amd assests (image, font, audio, json)esm关键字 export 允许将esm中内容暴露给其他模块关键字 import 允许模块引入到ems中import { aa } from './a.js';export { bb };// package.json 资源管理，安装什么包，设置项目标题或者名称type: module,强制将package下文件都是esmtype: commonjs,
2021-06-30 15:08:53
140
原创 常见vue选题
把你了解的vue响应式的原理阐述一下？vue中有三个核心类首先了解vue中的三个核心类Observer： 用来给对象的属性添加getter和setter，用来***依赖收集***和***派发更新***。Dep：用来收集当前响应式对象的依赖关系，每一个响应式对象都有一个dep实例，dep.subs = watcher[].是一个watcher数组。当数据发生变更的时候，会通知dep.notify()通知各个watcher。Watcher：观察者对象， render watcher 渲染，compu
2021-06-28 18:48:37
754
2
原创 HTML,CSS,浏览器 相关
网络中使用最多的图片格式有哪些？jpeg,gif,png最流行的是jpeg格式，可以把文件压缩到最小在ps以jpeg格式存储 时，提供11级压缩级别请简述CSS盒子模型一个css盒子从外到内可以分成四个部分：margin外边距，border边框，padding内边距，content内容。默认情况下，盒子的width和height属性只是设置content内容的宽和高。盒子真正的宽应该是：内容宽度+左右填充+左右边距+左右边框盒子真正的高应该是：内容高度+上下填充+上下边距+上下边框视频、
2021-06-28 16:49:58
104
原创 Node篇
v8的内存限制是多少？为什么V8这样设计？64位系统下是1.4GB，32位系统下是0.7GB.因为1.5GB的垃圾回收堆内存，V8需要花费50毫秒以上，做一次非增量式的垃圾回收甚至要1秒以上。这是垃圾回收中引起npm是同node.js一起安装的包管理工具，能解决node.js代码部署上的很多问题。允许用户从npm服务器下载别人编写的第三方包到本地。允许用户从npm服务器下载并安装别人编写的命令程序到本地。允许用户将自己编写的包或者命令上传到npm服务器共别人使用。有哪些常用Stream流？分别
2021-06-08 14:55:36
60
原创 React篇
React中的key时什么。有什么作用同级组件之间的信息传递：通过状态提升，将信息共同报讯在父组件中，在通过回调函数更改信息之后再用props船体给子组件；跨层级组件通信：利用高级API-content上下文的方式Redux.React-redux等状态管理库结合异步请求处理redux-thunk,redux-sagaReact合成事件机制React中有自己的事件系统模式，通常被称为React合成事件。之所以采用这种自己定义的合成事件，一方面时为了抹平事件再不同平台体现出来的差异性，这使得R
2021-06-07 17:32:01
74
原创 Vue--题库
一般会在mounted中渲染从后端获取的数据（页面初始化时，如果有操作dom的事件一般也会放在mounted钩子函数中。当然，以可以放在create中，前提需要使用this.$nextTick(function(){}),在回调函数中操作dom)阶段二：Vue实例运行阶段beforeUpdate数据依赖改变或者用￥forceUpdate强制刷新时，对象data中的数据已经更改（虚拟dom已经重新渲染），但是页面中的值韩式原来，未改变，以为此时还未开始渲染dom；update此时data中的数据和页面.
2021-06-07 16:50:34
266
原创 小程序--配置--CSS--WXML
Sass Less是什么？大家为什么要使用他们？他们时CSS预处理器。是CSS上的一种抽象层。他们是一种特殊的语法，语言编译成CSS。json配置文件，小程序设置，如页面注册，页面标题及tabBar；app.js整个小程序的全局配置，包括：pages:[所有页面路径]网络设置（网络超时时间）界面表现（页面注册）window:{背景色，导航杨书记，默认标题}底部tab等app.js监听并处理小程序的生命周期函数，声明全局变量；app.wxss全局配置的样式文件。请谈谈wxml与标准的.
2021-06-07 16:43:51
424
原创 视差滚动效果？让页面里的字体清晰，变细用CSS怎么做？
视差效果通过在网页向下滚动的时候，控制北京的移动速度比前景的移动速度慢来创建出令人惊叹的3D效果。实现方式：CSS3实现有点：发开时间短，性能和开发效率比较好。缺点：不能兼容低版本的浏览器。jQuery实现：通过控制不同滚动速度，计算每一层的时间，控制滚动的效果。-webkit-font-smoothing 在window系统下没有起作用，但是IOS设备上起作用-webkit-font-smoothing: antialiased是最佳的，灰度平滑。..
2021-06-07 15:02:28
106
原创 什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
响应式网站设计是一个网站能够兼容多个终端，而不是为每一个终端做一个特定的版本。基本原理是通过媒体查询@media监测不同的设备屏幕尺寸做处理。兼容低版本IE可以使用JS辅助一下来解决。...
2021-06-04 11:32:07
154
原创 浏览器是怎样解析CSS选择器的？
原理：有点类似与轮播，整体的元素一直排列下去，假设有5个需要展示的全屏页面，那么告诉是50%，只是展示100%，剩下的可以通过tranform进行y轴定位，也可以通过margin-top实现。属性： overflow: hidden;transition: all 100ms area;...
2021-06-04 11:31:49
106
原创 CSS优化、提高性能的方法有哪些？
避免过度约束避免后代选择符避免链式选择符使用紧凑的语法避免不必要的命名空间避免不必要的重复最好使用表示语义的名字，一个好的类名应该是描述他是什么而不是像什么。避免 ！important，可以选择其他选择器尽可能的精简规则，你可以合并不同类里的重复规则。...
2021-06-04 11:31:29
139
原创 移动端的布局用过媒体查询吗？
通过媒体查询可以为不同大小和尺寸的媒体定义不同的css，适应相应的设备的显示。里边引入: css中定义： @media only screen and (max-device-width:480px){}
2021-06-04 11:30:34
85
原创 CSS里的visibility属性有个collapse属性值，在不同浏览器下有什么区别？
当一个元素的visibility属性被设置成collapse值后，对于一般的元素，他的表现跟hidden是一样的。在重合元素外包裹一层容器，通过改变此div的属性使两个盒子分别属于不同的BFC，以此来阻止margin重叠。...
2021-06-03 17:10:40
113
原创 如何实现一个 div 的上下垂直居中？
<！DOCTYPE HTML><html lang="en"><head> <meta charset="UTF-8"> <title>index</title> <style> html,body { width: 100%; height: 100%; margin: 0; padding: 0; } .content { width: 300px; hegiht
2021-06-03 17:01:33
190
原创 CSS优化，提高性能的方法有哪些？
加载性能：CSS压缩： 将写好的CSS进行打包压缩，可以减少很多的体积；CSS单一样式：当需要下边距和左边距的时候，很多时候选择：margin:0 0;比margin-top:0;margin-bottom:0;执行的效率更高。选择器性能：关键选择器，选择器的最后面的部分为关键选择器（即用来匹配目标元素的部分）。...
2021-06-03 15:53:16
66
原创 为什么要清除浮动？清除浮动的方式？
清除浮动是为了清除使用浮动元素产生的影响：浮动的元素，高度会塌陷，而高度的塌陷使我们页面后i按的布局不能正常显示。清除浮动的方式：1、额外标签法：给谁清除浮动，就在其后额外添加一个空白标签。优点：通俗易懂，书写方便。缺点：添加许多无意义的标签，结构化比较差。2、父级添加overflow方法：可以通过触发BFC的方式，实现清除浮动的结果。优点：代码简洁，慎用，若该父盒子里还有position定位会引起麻烦。缺点：内容增加多时容易造成不会自动换行导致内容被隐藏掉，无法显示需要溢出的元素。ove.
2021-06-03 15:47:56
2794
原创 CSS3新增伪类有哪些？
p:first-of-type 选择属于其父元素的首个元素p:last-of-type 选择属于其父元素的最后元素p:only-if-type 选择属于其父元素唯一的元素p:only-child 选择属于其父元素的唯一子元素p:nth-child(2) 选择属于其父元素的第二个子元素...
2021-06-03 15:31:29
138
原创 解释一下Flexbox（弹性盒布局模型）？及使用场景？
flex 布局时CSS新增的一种布局方式，我们可以通过将一个元素的display:flex使它成为一个flex容器。任何一个容器都可以指定为flex布局。行内元素也可使用flex布局。一个容器有两条轴，一个时水平的主轴，一个时与主轴垂直的交叉轴。属性：flex-direction 定义主轴的方向。flex-wrap 定义是否换行。flex-flow 上述2个属性的简写。justify-content 定义项目在主轴上的对齐方式。aligin-items 定义项目在交叉轴上如何对齐。alig.
2021-06-03 15:28:46
134
原创 什么是渐进式渲染？
渐进式渲染是用于提供网页性能（尤其是提高用户感知的加载速度），以尽快呈现页面的技术。在一千互联网宽带较小的时期，这种技术更为普遍。如今，移动终端的盛行，二移动网络往往不稳定，渐进式渲染在现代前端开发中仍然有用武之地。比如：（1）图片懒加载——页面上的图片不会一次性全部加载。当用户滚动页面到图片部分时，javascript将加载并显示图像。...
2021-06-03 15:22:08
1224
原创 如何在页面上实现一个圆形的可点击区域？
map + area 或者 svgborder-radius纯 js 实现，一个点不在圆上的算法遇到过这种情况，一般将两个 标签换行写的时候会出现这种情况 百度1 百度2 解决方法：将两个 标签，合并在一行就可以了
2021-06-03 15:18:29
71
原创 页面可见性API可以有哪些用途？
通过VISIBILITY STATE 的值得监测页面当前是否可见，以及打开网页的时间；当页面被切换到后台进程时，自动暂停音乐或者视频的播放。
2021-06-03 15:13:49
128
原创 Websocket 如何兼容低浏览器？
Adobe Flash Socket ActiveX HTMLFile (IE) 基于multipart编码发送 XHR 基于长轮询的XHR。引用WebSocket.js 这个文件来兼容低版本浏览器。
2021-06-03 15:11:21
669
原创 nvm 命令与管理
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-06-01 18:38:27
79
原创 Using Storybook with Quasar Storybook core-js
一、故事书是一种工具快速开发防弹组件与组件分离到的目录部分用例实现,展示他们的外表,行为和功能的工具来轻松前端工程师与设计师沟通,用户体验和UI专家和PO。你可以开发独立的组件，就像Sketch设计组件一样。二、为了解释如何集成它们，我将使用@quasar/cli命令Quasar create创建一个简单的Quasar应用程序:quasar create storybook-quasar三、并继续使用默认值，因为这只是一个示例。我建议使用yarn作为包管理器。在本例中，我将使用yarn作为包管
2021-01-28 11:16:45
214
原创 ECharts 常用设置
目录设置默认触发事件action鼠标指向别的图块时,展示选中数据的图块信息,隐藏默认色块高亮信息鼠标离开环形图时，展示默认第一条数据设置默认触发事件actionmyChart.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: 0});type 触发action类型 seriesIndex series索引 dataIndex 高亮数据索引 注意：type:'pieSelect'不可使
2021-01-26 16:13:56
327
原创 二维页面实现三维假视角————perspective
参考效果案例：https://codepen.io/moolab/pen/eYdPovB?editors=1100<body><h1 align="center">前选择“世界”</h1><div class="container"> <div class="honeycomb"> <div class="hexes-1 column"> <a class="hex">
2021-01-18 10:49:35
153
原创 input 输入框 type = number 时，去掉后面的小三角
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } input[type="number"]{ -moz-appearance: textfield; }在现在项目中，使用的是vue+element，通常写当前页面的样式时使用scoped，但是这样会发现上面的代码失效，此时需要使用/deep/去寻.
2021-01-18 10:43:38
1694
原创 vue 页面路由跳转
一、同页面跳转1>使用<router-link :to={name:'', params:{name:''}}></router-link>2>使用@click:"to()"this.$router.push({name: '', //与routes中name一致param: {},})this.$router.push({path: '',//与routes中path对应query: '',})二：打开新窗口const ui =
2020-05-18 10:59:15
174
原创 qs解析 vue img标签src动态引用 属性动态修改
一、qs.parse()将url解析 成对象qs.parse(localtion.search.parse("?")[1])qs.stringify()将对象序列化成URL形式以&进行拼接let obj = {a: 'a', b: 'b', c: 'c'}qs.stringify(obj)二、<img :src="require('../assets/' + imgsrc + '.png')" />三、<div :style="{width:
2020-05-18 10:40:47
278
原创 ElementUI 在VUE中配置 main.js与axios的关系
一、在main.js中：import ElementUI from 'element-ui'Vue.use(ElementUI)二、在main.js中，数据请求axios不能在这里配置
2020-05-18 10:22:31
806
原创 webpack打包 静态地址引用错误
在config文件下index.js的（52~53）添加'./'和'.'build:{assetsSubDirectory: './static',assetsPublicPath: './',}webpack打包 element-icon....toff找不到在build->utils.js的49行加publicPath: '../../',
2020-05-15 18:56:24
240
原创 vue中父组件与子组件之间的数据交流
一、父组件调用子组件父组件：在子组件中[@自定义事件]例子：<子组件 @自定义事件=‘方法A’></子组件>methods -> 新加[方法A]来接收子组件的数据例子：方法A（子数据）{this.数据 （在父组件data新new数据接收） = 子数据}，之后再父组件中使用新new的参数值。子组件：this.$emit('自定义事件'，子组件中的数据（属性）)[前提是在子组件中的mounted调用]二、子组件调用父组件子组件：与data
2020-05-15 18:51:34
162
原创 VUE CLI 脚手架流程
1.cpm install vue-cli -g2.初始化项目，生成项目模板vue init webpack 项目名称3.今日到项目目录，安装模块包cpm install4.启动项目cpm run dev相关命令-s 打包输出必须有依赖（vue）-g 无打包依赖全局淘宝镜像：npm install -g cnpm --registry=https://registy.npm.taobao.org打包注意事项：将config文件下index.js中第26行.
2020-05-15 18:30:54
113
原创 微信 小程序 自定义顶部导航栏
一、在app.js中获取设备的参数let menuButtonObject = wx.getMenuButtonBoundingClientRect(); console.log(menuButtonObject) wx.getSystemInfo({ success: res => { //导航高度 let statusBa...
2020-01-14 17:25:14
607
原创 微信 小程序 父组件与子组件之间的传值和调用
一、父组件调用子组件的方法（1）首先在父组件的json文件中添加子组件路径"usingComponents": { "ARInfo": "../other/main" },（2）在父组件wxml中添加子组件<ARInfo bindtransfer="closePicture" bind:myevent="get_emit" id="ARInfo" wx:if=...
2020-01-14 12:27:07
553
1
原创 微信 小程序 之 动画 多种方式
（1）小程序API原生Animationhttps://developers.weixin.qq.com/miniprogram/dev/api/ui/animation/Animation.html（2）Canvas渲染1、非原生组件下canvas的渲染可以使用image组件src，直接使用gif即可，大小限制不大2、原生（摄像机、地图等）组建下canvas的渲染必须使用...
2020-01-14 12:03:43
824
原创 微信小程序之数据埋点——阿拉丁
（1）注册阿拉丁账号（2）添加埋点项目（3）获取SDK（4）获取appkey文档参考：https://tj.aldwx.com/help/?code=MTU3Nzc3OTE4MDQ0MTYwNDQyMmZlOTM5NDNkMjkzN2ZjMDU0YTliZGFj
2020-01-14 11:30:04
2367
原创 web前端数据埋点之--友盟和百度
一：友盟（1）注册友盟账号，添加站点，填写域名，填写进入链接（2）在统计代码中复制埋点代码到js文件或者html首页，例如下：<script type="text/javascript"> var cnzz_protocol = (("https:" == document.location.protocol) ? "https://" : "http://");...
2020-01-14 11:21:24
1602
原创 那些关于获取类名的方法。。。。给img标签更换src图片。。。
一、给img标签src更换图片地址$('#price-img-' + b).attr('src',"img/en-prize.png");二、获取有规律或者不同类名的方法$('#需要更换的img的id-' + 动态值b).attr('src',"图片路径");三、给文本标签更换文本信息$('#需要标识的标签的id-' + shopCarSkuList[b].mpId + '-'...
2019-09-24 16:44:18
314
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人