关闭

js获取光标位置

js获取光标位置1.概念和原理DOM中并没有直接获取光标位置的方法,那么我们只能间接来获取光标位置。DOM支持获取光标选中的范围,我们可以以此为切入点,来获取或定位光标的位置。当选取范围起始点和结束点一样时,就是光标插入的位置。1.1 术语anchor(瞄点):选区起点。focus(焦点):选区终点。range(范围):选区范围,包含整个节点或节点的一部分。1.2 SelectionSelectio...
阅读(32) 评论(0)

Flex布局

Flex布局常用的布局方式有3种: display:css内联和块级布局。 position:绝对、相对定位布局。 float:浮动布局。 传统的布局方式存在一个很明显的问题,那就是垂直居中不易实现。flex:弹性盒子布局,可以更好的实现响应式布局。Flex的使用Flex容器任何容器都可以flex布局。Flex容器的所有子元素也自动成为容器的成员,成为Flex项目。Flex容器默认存在2根轴线(水平...
阅读(22) 评论(0)

React-Mirror

React-Mirrormirror是阿里巴巴团队提供的一个开源框架。其主要作用是简化React、Redux开发的步骤。传统的React-Redux开发,需要逐步定义action、reducer、component等相关东西,看起来比较冗长。mirror框架将这些操作进一步封装,使之使用起来更加简单。安装Mirror$ npm i --save mirror使用import React from '...
阅读(145) 评论(0)

React生命周期详解

React生命周期详解React严格定义了组件的生命周期会经历如下三个过程: 装载过程(Mount),组件第一次在DOM树渲染的过程。 更新过程(Update),当组件被重新渲染的过程。 卸载过程(Unmount),组件重DOM树中删除的过程。 执行这3个过程的调用函数就是声明周期函数。装载过程该过程会依次调用如下函数: constructor():ES6类的构造函数(为了初始化state或绑定th...
阅读(328) 评论(0)

React动画效果

React动画效果平常我们使用的动画效果大多和jQuery.animate()相关,但是React就是被用来取代jQuery的。所以在动画实现的选择上我们常常选择CSS3的原生支持来实现。但是,CSS3的动画过程是:“在什么时间范围内,以什么样的运动节奏完成动画”。在用原生CSS3实现动画时,不好调试,因为动画过程可能一闪而过,并且在React中,样式的渲染必须等到组件已经挂载完成后,那么在组件加载...
阅读(171) 评论(0)

ESLint配置详解

ESLint配置详解解析器选项(parserOptions)"parserOptions": { "ecmaVersion": 6, //ES的版本,默认为5 "sourceType": "module", //指定源代码存在的位置,script | module,默认为script。 "ecmaFeatures": { //指...
阅读(100) 评论(0)

javascript:void(0);在火狐、IE中也会跳转到新的页面问题

在项目中遇到一个奇怪的问题:点我啊这样一段代码,在谷歌中点击a标签,并不会发生页面跳转,但是在IE和火狐则会跳转到一个空白页面。问题原因 浏览器默认处理事件的顺序有差异。 Chrome顺序:onclick -> href -> target IE和Firefox顺序:onclick -> ta...
阅读(195) 评论(0)

自定义React图片上传组件

现在网上有很多封装好的插件,但是我没有找到适合我们项目需求的,所以自定义封装了这个图片上传组件。该组件是基于React设计的,希望对你有帮助。你也可以去https://github.com/windSandEye/img-upload/tree/master下载我的源码。组件js文件(img-upload.js)import React from 'react'; import { Icon, Mo...
阅读(188) 评论(0)

ES6-Generator函数和async函数

ES6-异步函数Generator是一个状态机,它封装了多个内部状态。执行它将生成一个遍历器对象。Generator有2个特征: 声明时使用function* 函数内部使用yield声明内部状态调用函数后,函数并不执行,而且返回的也不是函数运行结果,而是一个指向内部状态的对象。 function* helloWorldGenerator() { yield 'hello'; yield 'w...
阅读(128) 评论(0)

js深拷贝对象

浅拷贝和深拷贝的区别浅拷贝:只拷贝对象的基础属性值,对属性值为对象或数组的属性则拷贝指针。 深拷贝:拷贝对象的所有属性作为一个全新的对象。拷贝前后的对象互不影响。浅拷贝var a = {name:"test",children:{name:"test1"}} //浅拷贝 var b = { name:a.name, children:a.children } a.name = "字...
阅读(107) 评论(0)

React-Redux学习

Redux流程图React和Redux分工React-Redux将所有组件分为了UI组件和容器组件。UI组件不带任何逻辑,只负责渲染,所有的数据都通过this.props提供。(由React负责)容器组件负责数据管理和业务逻辑处理。(由Redux负责)Providerreact-redux提供了Provider组件,用于保存store给子组件中connect使用。将它包裹在根组件的最外层,它会将st...
阅读(201) 评论(0)

promise深入了解

Pormise深入了解import React from "react";export default class Footer extends React.Component{ constructor(props){ super(props) this.state = { flag : 0, result:''...
阅读(158) 评论(0)

ES6对象扩展

ES6对象扩展 对象简写 ES6允许属性和方法名简写方式。 属性名的简写即只书写属性名,属性值则为与属性名同名的变量值。 方法简写即是省略function关键字。 属性简写 let name="es6"" style="border: 0px; display: block;font-family: Consolas, Inconsolata, Courier, monospace...
阅读(210) 评论(0)

Redux入门

简介 Redux是一个非常有用的框架,他主要解决状态的统一管理问题。而React则将所有组件视为状态机,所以Redux可以看作是一个React的数据管理中心。但需要注意,并不是必须用Redux来管理数据,只是该框架让复杂业务逻辑和多组件通信更加方便。 Redux的思想主要概括为下面2点: a.Web 应用是一个状态机,视图与状态是一一对应的。 b.所有的状态,保存在一个store对象里...
阅读(281) 评论(0)

Promise对象详解

1.简介 Promise是抽象异步处理对象以及对其进行各种操作的组件。 2.对象状态 Promise对象有2种状态: promise对象被 resolve 时的处理(onFulfilled) promise对象被 reject 时的处理(onRejected) 3.创建Promise对象 创建一个Promise对象一般分为2步: ...
阅读(500) 评论(0)
302条 共21页1 2 3 4 5 ... 下一页 尾页
    个人资料
    • 访问:539707次
    • 积分:7729
    • 等级:
    • 排名:第3025名
    • 原创:282篇
    • 转载:20篇
    • 译文:0篇
    • 评论:128条
    最新评论