前言发现Formik是在我学习redux-form过程中从国外一篇博客上偶然发现的，看到作者的高度肯定后我立即转到github上，正如许多朋友所注意的，我发现其星数达8282，这个数字在github虽然不算很高，但是在探讨基于React技术开发跨平台表单这个主题的开源库角度来看，这个数字已经相当不错了。不自觉地，我对比了redux-form与Formik的几个数据，如下：库开源库的时间星数redux-form3年以前10210Formik1年前8282几个不太肯定的结论（欢迎...
前言最近项目用到react,其实前年我就开始接触react，时光匆匆，一直没有时间整理下来（太懒啦）！如今再次用到，称工作间隙，对全家桶做一次总结，项目源码地址。废话不多说，上码。创建一个文件目录并初始化package.json mkdir react-Buckets npm init 填好相关信息如图安装webpack需要有全局安装哦，不然一会用webpack编译时会报错的关于装依赖加入package.json时，加 --save-dev表示开发环境要用的依赖，如果加 -save表示生...
一、Hooks1. React Hook/Hooks是什么? (1). Hook是React 16.8.0版本增加的新特性/新语法 (2). 可以让你在函数组件中使用 state 以及其他的 React 特性2. 三个常用的Hook (1). State Hook: React.useState() (2). Effect Hook: React.useEffect() (3). Ref Hook: React.useRef()3. State Hook (1). State Hook让函数组件也可以有state状态, 并进行状态数据的读写操作 (2). 语法: const [xxx, setXxx] = React....
css*{margin: 0;padding: 0;margin-top: 10vh; } body{text-align: center; } canvas{margin: 0 auto;border: 1px solid #CCCCCC; }js<script type="text/javascript">window.addEventListener(‘load‘,function(){var canvas = document.createElement(‘canvas‘)document.body.appendChild(canvas)canvas.id = ‘myCanvas‘canvas.width = 600;canvas.height= 600;var myCanvas = document.getElementById(‘myCanvas‘)//检测...
anujs现在只差一个组件（mention）就完全支持阿里的antd UI库了。一共跑通346个测试, 应该是全世界最接近官方React的迷你框架了。以后的工作就是把React16的一些新特性支持了，包括组件返回数字、字符串、数组， componentDidCatch钩子与createPortal。主要更新点：抽象出一个Update类，用于封装组件实例上的所有私有数据抽象出一个instantiateComponente用于同时实例化有状态与无状态组件，从此再没有 mountStateless, updateStat...
state state顾名思义就是状态，它只是用来控制这个组件本身自己的状态，我们可以用state来完成对行为的控制、数据的更新、界面的渲染，由于组件不能修改传入的props，所以需要记录自身的数据变化。 那么，我们要如何修改state中的值呢？setState 时react用来修改state状态中的值的方法如何使用this.setState({ key:value}) 这样就行了。props react中说的单向数据流值说的就是props，根据这一特点它还有一个作用：组件之间的通...
有段时间没做react的项目了，前两天才发现react搞了一个不太小的动作，不是遵循原来的小版本号迭代，从0.14.x继续更新，而是直接跳到了15.0.X。虽然业界一直有这个观点，0.x的版本视为非稳定版本即测试版本，但是react一直以来就是特立独行的始终不上1开头的版本而是继续在0.n的道路上一发而不可收拾。开始的少年都是倔强的，后来就屈服了。。。始终有群众告诉他，你这个版本我以为不是稳定版本让我不想选用。当然react刚开始的时候...
前言每个框架都不可避免会有自己的一些特点，从而会对使用者有一定的要求，这些要求就是主张，主张有强有弱，它的强势程度会影响在业务开发中的使用方式。 一、Angular，它两个版本都是强主张的，如果你用它，必须接受以下东西：必须使用它的模块机制必须使用它的依赖注入必须使用它的特殊形式定义组件（这一点每个视图框架都有，难以避免）所以Angular是带有比较强的排它性的，如果你的应用不是从头开始，而是要不断考虑是否跟其他...
ReactMixhttps://github.com/xueduany/react-mix自从昨天发布起来，得到了不少小伙伴的热捧，很高兴帮助大家解决了憋在心中很久的问题“如果我只会HTML,Css,Jquery”，我可以不用学习就会什么MVVM啦？会ReactNative啦?答案自然是没问题，在这里，只要你通过我们的ReactMix框架，你都可以在12小时内上手一个App开发工作。就让我们来试试吧。首先申明，ReactMix的根基是在ReactNative的基础上实现了一层语法糖，帮助大家轻松方便的实...
react 生命周期 React 的生命周期分为三个阶段： 初始化、更新、销毁。 初始化1、getDefaultProps()设置默认的props，也可以用dufaultProps设置组件的默认属性.2、getInitialState()在使用es6的class语法时是没有这个钩子函数的，可以直接在constructor中定义this.state。此时可以访问this.props3、componentWillMount()组件初始化时只调用，以后组件更新不调用，整个生命周期只调用一次，此时可以修改state。4、 render()react...
In this lesson, we‘ll use next to create a universal React application with no configuration. We‘ll create page components that will render on the server if accessed directly, but function as you would expect in the client. We‘ll use the routing capabilities included with next to create links between the components using pushState and we‘ll incorporate our own React component. Finally, we‘ll ...
前段时间一直在做react native开发,下面介绍下自定义自定义radio的封装。 1 import React, { PureComponent } from ‘react‘;2 import PropTypes from ‘prop-types‘;3 import { View, Text, StyleSheet, TouchableOpacity, Image, Dimensions } from ‘react-native‘;4 import uniq from ‘lodash/uniq‘;5 import includes from ‘lodash/includes‘;6 import difference from ‘lodash/difference‘;7 8 const selected = re...
Reactjs code snippets （vs code 编辑器里面的一个插件 支持 react 得简写）下面网址是个react文档：https://materialui-ch.gitbooks.io/material-ui_doc_chinese/content/fu-wu-qi-xuan-ran.html原文：https://www.cnblogs.com/yjzs/p/12207646.html
23:01:17react脚手架搭建(个人用的是webstorm,所以分享下webstorm中的创建react脚手架项目的方法)1.创建新项目(前提是下载nodejs环境) 2.下载好在webstorm中右键自己创建的项目目录,菜单中会出现一个命令行工具,点进去 然后 npm start 开启服务3.在浏览器中打开 http://localhost:3000/ 可以看见react的默认页面初步的搭建完成,开始自己写东西 原文：https://www.cnblogs.com/5b4cn/p/9393501.html
起步react 特点不使用模板不是一个mvc框架响应式轻量级的js库原理虚拟dom 将dom抽象成js对象diff算法搭建开发环境react.js 核心文件react-dom.js 面向web端 渲染页面的dom 依赖于react核心文件react-native 面向移动端appbabel.js 将es6 转换成es5 jsx转化成javascript脚手架npm install -g create-react-app create-react-app -version 查看版本 create-react-app [projectName] //构建项目 npm start //启动 jsx语法js+...