React入门_学习笔记

首页免费课 React入门笔记

React入门

                
                Materliu
            Web前端工程师

                    查看讲师更多课程 
                    Materliu讲师的其他课程
                
Sass和Compass必备技能之Compass
中级·21218
免费课程
                                
Sass和Compass必备技能之Sass篇
中级·29321
免费课程
                                
Grunt-beginner前端自动化工具
高级·60394
免费课程
                                
                难度中级
            
                时长54分
            
                学习人数
            
综合评分9.60
                            323人评价
                        查看评价
                                9.8
                                内容实用
                            
                                9.5
                                简洁易懂
                            
                                9.5
                                逻辑清晰

最热最新

赵文斌 13:55

status改变时

查看全部

1 采集收起来源：React-Components-Lifecycle
2017-05-25
小郎Lie

重要的事情总会迟来一步，生活和爱情都是

查看全部

1 采集收起来源：React-JSX-Style
2017-05-20
museyuan

罐头是1810发明出来的，可是开罐器呢，却在1858年才发明出来。有时就是这样，重要的东西可能迟来一步，但却一定会到。生活和爱情，都是如此。程序，当然也不例外。

查看全部

1 采集收起来源：React-JSX-Style
2017-05-04
P妞酱酱 10:39

嘻嘻嘻

查看全部

1 采集收起来源：React-JSX-Style
2017-04-27
侠客岛的含笑

virtual DOM 虚拟DOM 在数据更新，先创建一套虚拟DOM，与更新的数据进行对比，然后只改变真实DOM中变化的部分

查看全部

1 采集收起来源：React入门课程介绍
2017-04-07
楚初 07:26

用div包裹是为了返回一个结果，而不是两个结果 React.render( <div> <TestClickComponent/> <br/><br/> <TestInputComponent/> <div>, document.getElementById('container'));

查看全部

1 采集收起来源：React-Event-Listener
2018-03-22
qq_风的味道

粉墨登场，演尽几番风云更迭；西皮二黄，多少聚散与圆缺。此情可鉴，都在戏里几转日月；此心不变，听我恋歌唱几阕

查看全部

1 采集收起来源：React-JSX-Style
2016-12-01
zoebelle4124144

React Components Lifecycle 三个状态 1.Mounted React Com.被render解析生成对应的DOM节点，并在插入浏览器的DOM结构的一个过程； 2. Update 一个mounted的Re Com.被重新render的过程；（只有影响了DOM结构时才会被改变） 3. Unmounted 一个mounted的RC对应的DOM节点被从DOM结构中移除的过程每一个状态R都封装了对应的hook函数

查看全部

1 采集收起来源：React-Components-Lifecycle
2016-10-31
肚小肚

React.findDOMNode(this.refs.tip) 可以寻找ref为tip的真实dom节点

查看全部

1 采集收起来源：React-Event-Listener
2016-10-19
魅_影

类form结构，以及自定义html标签，这些统称为react Components，这并不是html标签，只是react Components的实例，通过调用ReactDOM.render(，)方法,第一个参数是需要渲染的react Components，第二个参数是渲染完以后需要呈现的Element位置自定义的Components通过调用React.createClass()方法创建，参数是JS的object， eg： var Hello = React.createClass({ render: function() { return <div>Hello {this.props.name}</div>; } }); ReactDOM.render( <Hello name="World" />, document.getElementById('container') ); {}表示其中要执行JS表达式的值 this是指当前Components的实例，props表示使用react Components时，在其上添加的属性的集合，key值和定义时候的值相同例如{this.props.name}的值为World，和定义的name值相同 class 在ES6中，是一个关键字，用来声明一个类，在之前的ES5等标准中，是一个保留字，所以，在react中，不能再标签上直接写class，因为其是JS运行环境。声明css样式可以使用className。在react中行内样式不是用字符串的形式表示，需要用样式对象来表示。eg：style={{color:'red'}},写法符合驼峰标示。

查看全部

1 采集收起来源：React-JSX-Style
2018-03-22
魅_影

JSX: JS XML 语法糖：糖衣语法，计算机语言中添加的某种语法，对语言的功能没有影响，更方便程序员使用，增加程序的可读性，降低出错的可能性 eg：CoffeeScript，

查看全部

1 采集收起来源：React-JSX-Style
2016-10-17
Beborn_Ye

组件定义：React.createClass 组件使用：React.render(组件&props, 插入element) JSX语法： css类：className 行内样式: style={{color: 'red'}} 或 style={object} (object = {color: 'red',fontSize: '16px'})\\CSS 属性名就是以驼峰形式的 jsx参数：{this.props.(你定义的参数id)}

查看全部

1 采集收起来源：React-JSX-Style
2018-03-22
吖枫 11:28

点击事件

查看全部

1 采集收起来源：React-Event-Listener
2016-10-08
self_potato

stopPropagation()停止事件冒泡 preventDefault()停止事件默认行为 React.findDOMNode(this.fess.<ref属性的值>): 索引子组键的dom元素新版本需要注意的地方： 1，js文件引用换成最新的 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.0/react.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.0/react-dom.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script> 2， <script type="text/jsx"> 换成<script type="text/babel"> 3，var tipE = React.findDOMNode(this.refs.tip); 换成var tipE = ReactDOM.findDOMNode(this.refs.tip); 4,React.render 换成ReactDOM.render

查看全部

1 采集收起来源：React-Event-Listener
2018-03-22
绘心_

需要了解这部分的内容：Sass，Compass，Yeoman，Grunt，webpack，commonjs，nodejs,git,github

查看全部

1 采集收起来源：React入门课程介绍
2016-08-19