react1

1、方法用()  里面的每个参数之间用,分隔
2、对象(函数、数组)用{}
3、{/*注释...*/}

4 组件的生命周期可分成三个状态:
Mounting:已插入真实 DOM
Updating:正在被重新渲染
Unmounting:已移出真实 DOM

5、.bind(this) 让函数里的this指向函数外面的对象
在这里指的是当前的组件对象

6 多个标签要用<div>包起来

7 绑定事件:onClick(驼峰式命名) (原生html中用全小写)

8 ref="box" , 给子组件起名字,通过

9 React.findDOMNode(this.refs.属性名) 这个方法用了获取真实的dom节点

10组件:封装起来具有独立功能的ui控件,高度可重用(许多方法的集合)

11React. createClass({这是一个许多方法组成的对象});

12 组件
(1)React自有方法(组件生命周期里的方法) render componentWillUpdate componentDidMount
(2)自定义方法 handleClick handleChange handleMouseover

这是一个带有事件处理函数的组件,它一共有4个方法
var Content=React.createClass({
getInitialState:function(){
这是react自有方法
},
handleChange:function(event){
这是一个事件处理函数
},
handleSubmit:function(){
这是一个事件处理函数
},
render:function(){
这是react自有方法
},
});

onClick是一个组件或者子组件的属性,用=来赋值,this指向的是组件这个对象,handleClick指的是函数(即对象的方法),如果handleClick()指的就是函数返回的方法。
onClick={this.handleClick}

13 实例
var HelloWorld=React.creactClass({
handleChange:function(event){
console.log(event.target.value);
},
render:function(){ //当input值改变时,就执行handleChange函数
return <div>
<input onChange={this.handleChange}></input>
</div>;
},
});
React.render( 把组件渲染到body中
<HelloWorld></HelloWorld>,
document.body
);

时间: 2024-11-05 13:40:33

react1的相关文章

项目总结-REACT-1

1.实现页面跳转 <Link to ={ { pathname:`跳转地址`, query:{ 携带的数据 } }}> 2.DailyReportTable 中的onLoad 中的this.props. 没有值,或者不声明的时候 解构赋值出的变量是undefined 3.Antd.Spin 标签中放置内容,显示的时候内容就会在加载中 4.部分逻辑放在封装的组件当中, 5.页面刚一进入产生的逻辑可以放在生命周期函数中componentWillMount.Props change改变就用compo

React组件-初识React1(慕课)

一:由于单页面出现以下问题,所以就出现了react 单页面的问题: (1)如何保持数据与UI同步更新 (2)如何提高DOM操作的效率 (3)使用HTML开发UI界面异常复杂 React的特性: (1)自动化的UI管理:界面和显示数据的变化保持同步. (2)提高更高效的DOM操作:在内存中有个虚拟DOM,任何对Dom的操作都转换为对内存中虚拟Dom的操作,这样提高效率. (3)UI的组件化设计 (4)摆脱css,让开发者使用js开定制页面 (5)React是MVC中的V层 原文地址:https:/

如何选择前端框架:ANGULAR VS EMBER VS REACT

最近一段时间是令前端工程师们非常兴奋的时期,因为三大Web框架陆续发布新版本,让我们见识到了更强大的Web框架.Ember2.0在2个月之前已经发布,从1.0升级到2.0非常简单.几周之前React发布了0.14版本.还有很多流行的前端框架,像Backbone .Knockout及Aurelia.如果你想开发一个Web app,建议采用Angular,Ember或React三种框架中的一个.这三个框架可以说是安全级别最高,技术非常成熟的框架,而且有很多技术社区支持.所以你又开始纠结了,开发Web

React 学习资源分享 菜鸟刚学5天 博客写的不多 不懂写博客的套路

http://www.ruanyifeng.com/blog/2015/03/react.html 首先个人强烈推荐 阮一峰的React基础 细细过一遍,看得出大师的用心良苦 然后就开始看书般的过https://segmentfault.com/a/1190000005136764,github上有课程的源码,每天尽量把每节课的源码过一次,不行就在写一遍,受益匪浅. 还有一个是大致总结也挺好的资源 http://www.infoq.com/cn/React1 React深入浅出系列 PS:我有个

网站重构那些事儿

向Litten致谢! 濯去旧见,以来新意 距写上一篇博客足足有两个月了,实在是没有脸继续拖下去,毕竟马上就是要入职实习的人,还是要开始找回文字的感觉,而不是整天守望着防御塔和水晶了(话说你见过敌方的水晶吗?) 说正经的,当我准备开始撰写时看到我的personalWeb1.0 ,我还是愿意去开黑的,1.0真是太挫了,这里附几张美照. excuse me?是不是有一种某校教务系统的感觉,嗯,的确是不很清真的,所以personalWeb2.0的重构很快的定在了日程上. 不退则进 在做1.0时我考虑了很