最近打算把react知识点总结下: React特点 1.虚拟DOM 在内存中操作DOM,在内存中创建数据结构,只会更新有差异的地方 2.组件化 页面分成若干个组件,每个组件包含逻辑结构和样式 组件仅包含自身逻辑,与其他组件高度解耦 可重复使用 3.单向数据流 JSX javascript XML react发明的新的语法规范,允许javascript和html混合在一起,最后通过bable解析成常规的javascript…

①uncontrolComponent & controlComponent If your form is incredibly simple in terms of UI feedback, uncontrolled with refs is entirely fine. You don’t have to listen to what the various articles are saying is “bad.” feature uncontrolled controlled one-…

react react render()函数返回只能是一个标签(里面可以包其他东西) state(状态) vs props(属性) state 改变,视图改变,state是一个组件里面的状态,然后props是可以给一个组件添加属性方法. 可以传递到下一个组件,下一个组件通过this.props可以获得对应组件里面有多少方法和属性. state和props一般会配合使用. export default class Layout extends React.Component{ constructo…

1.Expanded组件 占满可用空间 -----可以到达类似flex布局中  第一列占用大量空间,所以它必须包装在Expanded widget中. 写死的高度改成Expanded自动撑满屏幕如果还是不能撑满试试加上flex:1的属性 Expanded expands its child to fill the available space --Using an Expanded widget makes a child of a Row, Column, or Flex expand to…

从 render 函数可以看出来,组件内部是通过 this.props 的方式获取到组件的参数的,如果 this.props 里面有需要的属性我们就采用相应的属性,没有的话就用默认的属性. 那么怎么把 props 传进去呢?在使用一个组件的时候,可以把参数放在标签的属性当中,所有的属性都会作为 props 对象的键值. 没有 state 的组件叫无状态组件(stateless component),设置了 state 的叫做有状态组件(stateful component). 因为状态会带来管理…

1.react内联样式写法: <div style={{width:'200px',height:'100px',border:'1px solid red'}}> </div> react的内联样式是对象,所以这样写.第一重大括号表示这是 JavaScript 语法,第二重大括号表示样式对象. 2.react的事件写法: onClick={this.handleClick} 注意:1)on后面的事件英文必须是大写: 2)事件用大括号{}括起来,事件函数后面不带小括号(). 3.r…

1.项目依赖 安装所需要依赖的其它第三方开源库,项目依赖如下: "dependencies": { "babel-core": "^6.21.0", "babel-loader": "^6.2.10", "babel-preset-es2015": "^6.18.0", "babel-preset-react": "^6.16.0&quo…

http://www.cocoachina.com/webapp/20150721/12692.html http://blog.csdn.net/slandove/article/details/50748473 http://www.oschina.net/news/76862/react-component-life-circle 注意: 下面我们在script标签里面编写代码,来输出Hello,world,代码如下: 这里需要注意的是,react并不依赖jQuery,当然我们可以使用jQ…

一.webpack 1. 什么是以及为什么要使用webpack 现在的网页功能越来越丰富,所需要的JavaScript和模块也会很多,为开发更加简洁,出现了以下方法,如模块化,scss,typescript等. 但有些语法是浏览器无法识别的.所以需要用到webpack. WebPack是模块打包器,它会将浏览器不能支持不能识别的语言语法,打包转换成浏览器可识别的语法,如(Scss,TypeScript等).   2. webpack 与 gulp 的区别 两者并无太多的可比性 .webpack是…

1 React简介 2013年由Facebook推出,代码开源,函数式编程.目前使用人数最多的前端框架.健全的文档与完善的社区. 官网:reactjs.org 阅读文档:官网中的Docs React 16 以上的版本称为React Fiber 2 React开发环境准备与工程目录简介 1)开发环境搭建 1⃣️引用js文件来使用react  ——大项目中,性能较低,可维护性较差 2⃣️通过脚手架工具来编码 ——脚手架可以自动构建一个大型项目的开发流程和目录,允许以一定的方式来实现js相互引用:可以…