weixin_43199050的博客

原创 webpack项目初始配置（二）——css modules与antd

在react项目中，直接引入样式文件会影响到全局样式，并非独立的。解决方法有五种：1、行内样式（react官网推荐）class App extends React.Component { // ... render() { return ( <div style={{ background: '#eee', width: '200px', heigh...

原创 React入门

一、初识ReactReact是一个处理页面的视图层框架，使用组件化的方式进行开发，采用的是JSX表达式，虚拟DOM快速渲染机制。 二、深入React使用第2种方式，配置文件都是打包好了的，如果要修改配置信息，就需要执行命令yarn eject暴露配置文件，不过这种暴露出来的配置文件可读性并不高，会给开发带来一定阻碍。...

原创 webpack项目初始配置（一）

一、github上创建项目仓库，带READNE.md二、项目初始化本地克隆项目，使用命令cnpm init项目初始化，命令结束之后项目文件夹下就会多出一个package.json文件。三、webpack配置——安装以及基本配置1、webpack安装2、项目文件夹下新建webpack.config.js文件以及src/app.js1）根据webpack官网修改we...

原创 本地存储

原创 ES6知识补充

一、箭头函数继承外层作用域：二、Promisepromise是为了解决异步函数层层嵌套的问题。1、promise结构2、链式promise三、对象

原创 页面加载过程（输入网址敲下回车后，都发生了什么？）

资源加载过程：URL解析 DNS查询 资源请求 浏览器解析一、URL结构二、DNS查询<link rel=“dns-prefetch” href="#">：加载页面时，预先进行指定网址的DNS查询，并缓存下来三、资源请求四、浏览器解析...

原创 windows平台下MongoDB安装和环境搭建

主要内容：下载安装包或者压缩包 添加db存储和日志存储文件夹 添加服务、配置环境变量、启动Mongo下载地址：https://www.mongodb.com/download-center?jmp=nav#community这里取消勾选，不安装图形化工具，否则时间非常非常长。安装之后，以管理员形式打开cmd窗口，进入mongod.exe目标目录...

原创 搭建基于Express框架运行环境

知识摘要：安装express generator生成器 通过生成器自动创建项目 配置分析一、安装express以及生成express项目安装：cnpm install express --save //安装express --version //查看版本cnpm i -g exp...

原创 Node基础编程

一、Node特点基于Chrome V8引擎 单线程 使用JavaScript开发后端代码 非阻塞的IO二、Common规范nodejs规范遵循CommonJs规范新建一个server文件夹以及server/user.js、server/Demo.js两个文件。在终端进入server文件夹，可执行文件：三、创建一个http server在二步骤的基础上，修...

原创 后端服务器搭建

一、本地安装虚拟机此处省略二、安装镜像系统分linux和windows版本，而linux具有centos和ubantu两种选择。可以去阿里巴巴开源镜像站下载所需要的镜像https://opsx.alibaba.com/mirror。3、安装secureCRT或Xshell（推荐安装Xshell）以及FlashFXP补充：securecrt只有英文版，国内程序员都是汉化版...

原创 Vue获取模拟数据（发送http请求）以及懒加载

一、给项目加上http请求的支持1、修改src/main.js文件加入两行代码：import VueResource from 'vue-resource'Vue.use(VueResource);二、调用请求1、创建在线模拟数据的接口可去easy-mock官网创建，具体方法不在此详述。比如，接口编辑如下：{ "status": "0", "co...

原创 Airtest自动化测试脚本自启动设置

一、获取测试脚本信息在Airtest IU界面启动程序（快捷键F5），在Log查看窗口复制脚本启动信息：二、设置bat文件新建记事本——将上一步骤复制的脚本启动信息复制到记事本中——保存后将记事本文件改成bat文件，即将文件后缀名txt改为bat——设置之后，双击这个bat文件即可启动程序。三、定时启动此步骤主要是要将bat文件设置成一个定时执行任务（以win10为例）。...

原创 React中的state

先提个问题：react中this.setState({xxx:''})与this.state.xxx='' 有区别吗？答案：有区别的。this.state通常是用来初始化state的，this.setstate是用来修改state值的。如果你初始化了state之后再使用this.state，之前的state会被覆盖掉，如果使用this.setState,只会替换掉相应的state值。...

原创 React的有状态组件和无状态组件

一、概念组件可以通过props和state来包含数据：props是一个组件的配置信息。它们是从组件的上层传递而来，在组件接收到之后就保持不变。 state一开始在组件构造函数中被设置为一个默认值，然后随着组件的执行而不断变化（通常都是由于用户的操作而导致）。一个组件在内部管理它自己的state，每当state变化时，组件就重新渲染。对于React的组件而言，state是可选的。在大部分...

原创 React生命周期

在创建React组件时，可声明一些函数，并让他们在组件的生命周期中的某些特定时间点被调用。了解每一个组件生命周期函数所扮演的角色以及它们的顺序，将让你可以在一个组件被创建或销魂时执行特定的操作。同时你还可根据需要去响应props或state的变化。此外，了解有关组件生命周期函数的知识，对于进行性能优化和在Flux架构中组织组件是必需的。一、加载阶段（Mounting）在挂载阶段中被调用...

原创 React的校验属性

显式的在组件中声明可以使用那些属性、那些属性是必需的、属性可以接收的数据类型等，是一个良好的实践。通过声明propTypes可做到这一点。使用举例：//引入校验属性PropTypesimport React,{Component,PropTypes} from 'react';class Test extends Component{ render(){ r...

原创 HTML的事件处理API

键盘事件 onKeyDown onkeydown 事件会在用户按下一个键盘按键时发生。 onKeyUp onkeyup 事件会在键盘按键被松开时发生。 onKeyPress onkeypress 事件会在键盘按键被按下并释放一个键时发生。 焦点和表单事件 onFocus onfocus 事件在对象获得焦点时发生。 onBlur onblur 事件会...

原创 表格组件——ag-Grid研究

ag-Grid官网一、功能概述注：红色部分是ag-Grid Enterprise版本才有的功能，ag-Grid Community版本并不支持。 功能点 功能概述 无限滚动，快速渲染 无限滚动，快速渲染，性能较优 分组/聚合 表头灵活分组，分组行中显示各种聚合列值 过滤排序 具备过滤以及排序功能，并通过按住SHIFT对多个列进行排序...

原创 表格组件——FixedDataTable研究

FixedDataTable官网一、功能说明注：绿色部分为优势部分功能点 描述 列冻结 支持表格左右侧列冻结 可伸缩列 列宽随意伸缩 列拖拽 拖拽列实现列位置变化 过滤排序 简单的搜索过滤框以及数字大小、字母排序 快速显示某一列 输入某列对应的index值，以显示该列（如果列数较多，表格宽度不够，某列未显示） 固定表格高度 ...

原创 表格组件——React Data Grid与Antd-Table功能比较

注：功能参照于官网，自定义功能扩展有待完善。（表格可跳过，可直接看文章末尾总结部分）react data grid官网antd官网一、reactdata grid主要特点1、快速渲染，支持无限滚动。移动端的瀑布流，PC端商品列表的无限下拉刷新等，都体现了无限滚动的重要性，antd-table本身是基于rc-table的扩展，而rc-table所属的react-compone...