- 博客(335)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 点击页面的“回到顶部”按钮，页面滚动到顶部的几种方法，以及设置 scrollTop问题
点击页面的“回到顶部”按钮，页面滚动到顶部的几种方法一、使用锚点1）使用默认链接锚点，设置a链接的href属性值为"#top"即可实现 <div><a href=" ">返回顶部</a ></div>2）href指向特定的id<div id=“element1”>元素1</div><a href=“#element1”>回到元素1</a >二、scrollTop属性:元素未滚动时，sc..
2020-11-28 22:40:01
4846
原创 物理返回键事件处理
物理返回键1）app内：在app1上，H5和app约定好在window对象上定义一个全局的方法，比如window.back方法，H5会在路由定义位置，定义该方法。当触发物理返回键的时候，app会监听双方定义好的方法back，如果有定义该方法，则执行方法2）非app内，比如浏览器，微信等环境，使用popstate方法监听这里处理的时候，需要区分是路由触发的还是物理触发的，路由触发popostate()方法，则不执行物理事件处理（由于router.replace()和router.push()方法.
2020-11-28 22:23:45
729
原创 npm包开发时，就可以时时看到效果
我们在开发npm包组件的时候，想在开发过程时，就可以看到效果，通过npm link就可以实现该目的1）关联依赖包，在这里，我们有两个项目npm-link-module，是我们要开发的npm模块npm-link-example,是我们要运行npm模块的项目首先，进入我们的npm-link-module项目，执行npm link然后，进入npm-link-example项目，执行 npm link npm-link-module通过以上两步就可以达到时时看到效果的目的了。注意以上的步骤顺序不
2020-11-28 22:20:36
340
原创 开发中遇到的问题以及解决思路
1、控制台报can not resolve相应的包名问题解决思路：1）在node_modules文件夹下查找是否有该包，如果没有就安装该插件，在运行下项目是否报错2）如果确定node_modules下有安装该插件，看下是否使用了包的别名，在配置里面有在alias属性下配置别名2、页面加了height:固定值，overflow：scroll，但是当内容超出设定的height值，不能滚动一般给一个容器设置了height固定值，overflow：scroll当内容高度超过设定值时，会出现.
2020-11-28 22:04:08
1132
转载 路径上有/**/、/*/的含义
1、路径上有/**/、/*/的含义'/node_modules/@pa_hcz/umc-ui-editor/src/components/**/package.json'/** 匹配任意多级路径如/aa/bb/cc/* 仅可匹配一级路径如/aa/? 仅可匹配一级路径且最多只有一个字符 如/a , /2、路径中“./”、“../”、“/”代表的含义，参考文档https://blog.csdn.net/baidu_41878679/article/details/82770461...
2020-11-28 18:29:26
3731
转载 package.json. package-lock.json文件的区别
package.json的作用package.json缺陷这时候package-lock.json出现，用于解决什么问题作用：package.json文件定义了项目所需要的各种模块，以及项目的配置信息`npm install` 命令根据这个配置文件，自动下载所需的模块缺陷package.json 文件只能锁定大版本，也就是版本号的第一位，并不能锁定后面的小版本，`npm install` 都是拉取的该大版本下的最新的版本，为了稳定性考虑我们几乎是不敢随意升级依赖包的，这将导致多出来很
2020-11-28 18:23:18
120
原创 设置数组的length=0和直接设置数组为空数组的区别
设置数组的length=0和直接设置数组为空数组的区别比如：aa = [1,2]bb = [3,4]cc = aadd = bbaa = [] / / aa重新指向另一个内存地址，而cc指向的aa初始化时的地址没变bb.length = 0 // bb 还是指向初始化时内存地址console.log(aa, bb, cc, dd)[],[],[3,4],[]...
2020-11-28 18:19:01
1621
原创 高德地图定位问题
记录下使用高德、百度地图遇到的一些问题1、从定位中拿城市名，一般情况下高德地图返回的字段名是city，但是直辖市返回的是字段provinceconst addressComponent = positionResult.regeocode.addressComponentcity: addressComponent.city || addressComponent.province || this.$store.state.user.city如果以上方式还是拿不到城市名，就用app上的定位去
2020-11-28 18:09:03
1303
原创 css设置元素居中的方法
1、水平居中1) text-align：设置块级元素(父级元素)里面的内容水平居中<div class="parent"> <span>hao </span></div>.parent{ text-align: center;width: 0.5rem;background: gray;color: yellow;}2) width: fit-content————父级元素的宽度设为该值，由子元素内容撑开父元素...
2020-11-22 16:19:07
284
原创 window.onpopstate、window.history.pushState、window.history.replaceState、window.onpageshow
window.onpopstate、window.history.pushState、window.history.replaceState API的区分window.onpageshow控制浏览器历史记录的api——window.onpopstate()，每当处于激活状态的历史记录条目发生变化时，popstate事件就会在对应window对象上触发window.history.pushState(). window.histoey.replaceState()添加和修改历史记录条目,与..
2020-11-14 22:00:37
2991
转载 js的防抖和节流
写这篇文章主要用于自己以后查漏防抖和节流的共同点：限制函数的执行频率，以优化函数触发频率过高而导致响应速度跟不上触发频率，出现延迟、假死、卡顿现象1、防抖：对于短时间内连续触发的事件（scroll,resize,click,,,,,）,在某个时间期限内，事件处理函数只执行一次 场景：在第一次触发事件（比如click）时，不立即执行处理函数handler，而是给出一个期限delay，然后 1）在delay内，没有在触发事件click,那么就执行处理函数handler ...
2020-10-25 21:26:59
229
原创 vscode编辑器使用
vscode编辑器使用1、vscode安装了代码提示插件IntelliSense for CSS class names in HTML，在编辑的时候还是没有提示全代码，可以参考这篇文章：https://www.jianshu.com/p/179f16d43026
2020-10-24 22:53:37
319
原创 mac 下快捷键的使用
系统命令1、Mac显示隐藏文件命令的快捷键：command + shift + .2、在控制面板显示文件内容：在当前目录下的文件直接用cat命令：cat .ssh，或者直接写全路径：cat ~/.ssh3、显示当前路径下的所有文件夹和文件名：ls4、打开文件夹命令：打开当前路径下的文件夹：open . ; 打开当前文件夹下指定的文件夹： open folderName： open img; 打开当前文件下的文件： open filename.后缀5、在当前文件下创建文件夹命令： ...
2020-10-24 18:56:23
216
转载 项目首次初始化并将项目提交到GitHub上
这篇博客，主要是自己用于防止下次遇到类似问题，能快速定位解决问题1）项目初始化后，需要将代码提交到github上的步骤：https://blog.csdn.net/wyjares/article/details/819788162）如果本地项目和远程项目建立联系之后，执行命令git push origin master -u报下面的错误：git@github.com: Permission denied (publickey). Could not read from remote repos
2020-10-19 22:13:34
393
翻译 单页应用与多页应用的区别
多页面网站的定义：每一次页面跳转的时候，后台服务器都会返回一个新的html文件，这种类型的网站就称为多页面网站（多页面应用）优点：首屏时间快---整个页面展现出来所需要的时间 SEO效果好首屏时间快的原因：当访问一个页面的时候，服务器返回一个html，然后这个html展现出来，这个过程只经历一个http请求的过程，所以页面展现快，请求回来了，页面就展现出来了SEO效果好的...
2019-03-29 17:14:13
1406
原创 Vue中需要注意的事项
1、在子component中的data不能是一个对象，必须是一个函数，然后该函数返回一个对象data(){ retrun { swiperOption:{} }}2、vue中，如果每个组件发生一个ajax请求，就会造成很大的性能损耗，如何操作可以降低性能损耗问题：在vue中，一个页面被拆分成多个component，如果每一个component都发生一个ajax请求，...
2019-03-29 10:00:15
602
原创 在轮播图中去抖动
问题：在页面中存在抖动问题，如下图所示，当网速较慢的时候，图片加载的比较慢，当图片没有加载完前，test是在图片的左上角位置此时不显示图片，当图片加载完，test在图片的左下角，这时候的变化就是页面抖动。发生抖动的原因：当图片没有加载完成前，img的高度为0，没有将其撑开，等到图片加载完之后，img被撑开解决方法：通过给swiper的父级元素设置一个固定的高度来解决的，width:10...
2019-03-28 17:43:58
1503
原创 前端面试十一
98、比较typeof()和instanceof() 通过Object.prototype.toString.call()可以判断所有变量的类型相同点：JavaScript中typeof 和 instanceof 常用来判断一个变量是否为空，或者是什么类型的typeof：返回值是一个字符串，用来说明变量的数据类型(1) typeof 一般只能返回如下几个结果：number,bool...
2019-03-22 09:02:17
1194
原创 前端面试十
46、在做项目的时候有用到哪些基础知识或者说技术栈面向对象、继承、ajax通信原理、跨域问题、性能优化、公用模块的提取、制作图标icon、代码优化等1）整个项目使用jquery框架搭建，jquery是js的一个库，他封装了js对象以及事件，从而极大的简化了js的编程，对于操作DOM更加方便2）首页的轮播图采用bootstrap.js制作3）对于一些弹窗提示，则把Bootstrap中...
2019-03-21 16:40:25
877
原创 前端面试九
41、请解释事件代理一篇写的很好的博客：https://blog.csdn.net/majian_1987/article/details/8591385事件代理的定义：把一个或者多个元素的事件委托到它的父元素或者更外层元素上，这主要得益于浏览器的事件冒泡机制事件代理的好处：1）减少内存消耗，动态绑定事件2）其中事件的参数event中的event.target是指触发...
2019-03-21 16:37:45
1135
原创 前端面试八
10）Reflect：ES6 为了操作对象而提供的新 APIReflect对象设计的目的：（1）将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。现阶段，某些方法同时在Object和Reflect对象上部署，未来的新方法将只部署在Reflect对象上。也就是说，从Reflect对象上可以拿到语言内部的方法...
2019-03-21 16:35:15
353
原创 前端面试七
优化问题-----什么是长缓存？在webpack中如何做到长缓存优化？浏览器在用户访问页面的时候，为了加快加载速度，会对用户访问的静态资源进行存储，但是每一次代码升级或者更新，都需要浏览器去下载新的代码，最方便和最简单的更新方式就是引入新的文件名称。在webpack中，可以在output给出输出的文件制定chunkhash,并且分离经常更新的代码和框架代码，通过NamedModulesPlug...
2019-03-21 16:29:46
587
原创 前端面试六
26、用js或jQuery获取id为container的div里边的所有a标签，并把字体大小设置为18px；同 时把第三个a标签设置为块级元素，并把他的宽高分别设置为300px和500px。 这里主要是第几个子元素使用css属性nth-child(index)，index从1开始27、请用jquery和原生js分别实现创建、添加、复制、移除、移动、和查找DOM结点●js 创建DOM...
2019-03-21 16:27:04
495
原创 前端面试四
11、XMLHttpRequest对象的常用方法和属性XM核LHttpRequest对象的介绍Ajax的心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。通过XMLHttpReque...
2019-03-21 16:21:20
446
原创 前端面试题三
89、介绍js基本数据类型1）ECMAScript中有5种基本数据类型: Undefined、Null、Boolean、Number和String1种复杂的数据类型—Object，Object本质上是由一组无序的名值对组成的其中Undefined、Null、Boolean、Number都属于基本类型。Object、Array和Function则属于引用类型，String有些特殊...
2019-03-21 16:19:23
11278
2
原创 前端面试五
25、列出你所知道的设计模式并简述设计模式的定义：● 设计模式是一套被反复使用、多数人知晓的、经过分类的、代码设计经验的总结。使用设计模式的目的：●为了代码的可重用性、可靠性、可维护性、更容易被他人理解设计模式的分类：主要分为三大类创建型模式：5种，Factory Method工厂方法模式、Abstract Factory抽象工厂模式、Singleton单例...
2019-03-21 16:17:03
347
原创 前端面试题二
第二阶段 JavaScript、jQuery、ECMAScript、JSON1、jQuery this与this区别$(this)是jquery对象，是用jQuery包装过的javascript中的this，能调用jquery的方法，例如click(), keyup()this则是html元素对象，能调用元素属性，例如this.id,this.value。例如假设已经使得this和...
2019-03-21 16:07:51
1545
原创 前端面试一
前端面试题第一阶段 HTML、CSS、HTML5、CSS31、XHTML、HTML、XML的异同XHTML-Extensible Hypertext Markup Language：可扩展超文本标记语言，以 XML 应用的方式定义的 HTML，更严格更纯净的 HTML 版本HTML-Hypertext Markup Language：超文本标记语言，用来显示数据，即用标记标签来描述...
2019-03-21 11:33:59
2276
翻译 生命周期函数、redux的使用（一）
在定义React组件的时候，render()函数返回的html必须只有一个根元素，要想这个根元素不显示并且不占据页面空间，可以从react中引进Fragment组件JSX语法细节在JSX里面写注释的方法：多行注释：{/*注释注释*/}单行注释：{//注释注释}属性：dangerouslySetInnerHTML={{_html: item}}可以让内容ite...
2019-03-13 22:03:20
4799
转载 直接操作DOM一定比虚拟DOM操作耗时，diff算法，key值，虚拟 DOM的定义
直接操作DOM一定比虚拟DOM操作耗时吗？或者一次直接DOM操作一定比一次虚拟DOM操作耗时吗？1）虚拟DOM的本质就是一个JS对象，虚拟DOM减少了真实DOM的操作，当修改数据的时候，就是修改虚拟DOM产生全新的虚拟DOM，新旧虚拟DOM使用diff算法，得到patch(也就是需要修改的部分)，然后将这个patch打到浏览器的DOM上（减少重绘和回流，从而达到性能优化的目的...
2019-03-13 21:54:45
2997
1
翻译 React组件定义种类，容器型组件，展示型(UI)组件，受控组件，props和state的区别，setState
创建组件有两种方法：注意：用function构造函数创建无状态组件，只有props，无自己的私有数据和生命周期---用的不多；注意：class关键字创建有状态组件，有自己的私有属性(this.state)和声明周期---用的比较多有状态组件和无状态组件的本质区别：有无state属性、有无生命周期类组件（class component）和函数式组件（functional c...
2019-03-13 20:29:47
810
转载 Git的基本使用
原文地址 git的操作：https://www.cnblogs.com/mr-wuxiansheng/p/6974170.html
2019-03-08 15:26:43
337
翻译 库和框架，vue和react的比较
库和框架，vue和react的比较库：小而巧，只提供API，可以方便的从一个库切换到另外一个库，代码几乎不需要改变框架：大而全的是框架，，框架与框架之间的切换比较困难vue和react的比较一）组件化方面1）什么是模块化模块化是从代码的角度进行分析，把一些可复用的代码，抽离为单个模块，便于项目开发和维护2）什么是组件化组件化是从UI界面角度进行分析，把一些可...
2019-01-10 19:52:56
3185
原创 react项目中遇到的bug
1、react-router使用时，在浏览器出错：Attempted import error: 'Link' is not exported from 'react-router 源代码如下： import React, { Component } from 'react';import {Menu} from 'semantic-ui-react';import 'seman...
2019-01-10 10:06:23
24540
1
翻译 React Bootstrap
react-boostrap是用React重建的bootstrap，完全不依赖于bootstrap和jQuery1、安装npm install react-bootstrap@next bootstrap2、importing要用到哪些component就引进具体的component，这样可以减少代码量import Button from 'react-bootstrap/...
2018-12-28 10:35:35
3834
转载 FAQ in react，react-transition-group
AJAX AND APIs1、在React中如何调用AJAX？使用AJAX库：Axios, jQuery AJAX，the browser built-in window.fetch 2、应该在那个生命周期函数中调用AJAX获取数据？在生命周期函数componentDidMount()中调用AJAX，并且可以调用SetState（）设置state//API返回的JSO...
2018-12-27 15:40:44
334
转载 API reference about React
<一>React1、Components作用：将UI分成独立的模块，使独立的模块可以重复使用Components的定义方式：1）使用ES6子类语法，React.Component、React.PureComponent2）不使用ES6子类语法，使用模块create-react-class3）可以定义成函数React.memo A、React.compon...
2018-12-26 10:14:49
366
翻译 main concepts about react
1、React一共有三个js文件，必须首先加载： <script src="../build/react.js"></script> <script src="../build/react-dom.js"></script> <script src="../build/browser.min.js"
2018-12-24 19:56:23
292
原创 js基础算法题
js基础算法题正则1、给定字符串 str，检查其是否包含连续重复的字母（a-zA-Z），包含返回 true，否则返回 false// 在正则表达式中，利用()进行分组，使用斜杠加数字表示引用，\1就是引用第一个分组，// \2就是引用第二个分组。将[a-zA-Z]做为一个分组，然后引用，就可以判断是否有连续重复的字母。function containsRepeatingLette...
2018-08-26 19:37:09
906
原创 jQuery源码学习
jQuery使用上的几大特点：1、使用$()函数方式直接生成jQuery对象2、链式调用（在函数的结尾返回this，this的值是根据函数运行的时候确定的） 无new函数创建对象：把 jQuery.prototype.init.prototype = jQuery.prototypejQuery.fn，它实际上是 prototype 的一个引用，指向 jQuery.protot...
2018-08-17 17:01:27
1111
在线剪切图片：cropbx.js插件的源代码
2017-11-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人