react基础概念.doc

1、var Table = require(../components/table); 依赖加载 2、 getInitialState:function(){ componentDidMount:function(){ 在初始化渲染之后立刻调用，仅客户端有效 ?3、componentWillReceiveProps 在组件接收到新的 props 的时候调用。在初始化渲染的时候，该方法不会调用??开头），就用 HTML 规则解析；遇到代码块（以??开头），就用 JavaScript 规则解析 ?React 组件样式是一个对象，所以第一重大括号表示这是 JavaScript 语法，第二重大括号表示样式对象。?class?属性需要写成?? this.props?对象的属性与组件的属性一一对应，但是有一个例外，就是??属性。它表示组件的所有子节点这里需要注意，?this.props.children?的值有三种可能：如果当前组件没有子节点，它就是?undefined?;如果有一个子节点，数据类型是?object?；如果有多个子节点，数据类型就是?array?。所以，处理?this.props.children?的时候要小心。组件免不了要与用户互动，React 的一大创新，就是将组件看成是一个状态机，一开始有一个初始状态，然后用户互动，导致状态变化，从而触发重新渲染 UI由于?this.props?和?this.state?都用于描述组件的特性，可能会产生混淆。一个简单的区分方法是，this.props?表示那些一旦定义，就不再改变的特性，而?this.state?是会随着用户互动而产生变化的特性。 React 为每个状态都提供了两种处理函数，will?函数在进入状态之前调用，did?函数在进入状态之后调用，三种状态共计五种处理函数。 componentWillReceiveProps(object nextProps)：已加载组件收到新的参数时调用 script?标签的?type?属性为?text/babel?。这是因为 React 独有的 JSX 语法，跟 JavaScript 不兼容。凡是使用 JSX 的地方，都要加上?type=text/babel?。 ?HTML 语言直接写在 JavaScript 语言之中，不加任何引号，这就是?JSX 的语法，它允许 HTML 与 JavaScript 的混写 JSX?是一个看起来很像 XML 的 JavaScript 语法扩展。React 可以用来做简单的 JSX 句法转换。 要使用 JavaScript 表达式作为属性值，只需把这个表达式用一对大括号 ({}) 包起来，不要用引号 ()。 var content = ( Nav {/* 一般注释, 用 {} 包围 */} Person /* 多 行 注释 */ name={window.isLoggedIn ? window.name : } // 行尾注释 / /Nav ); React 里，只需更新组件的 state，然后根据新的 state 重新渲染用户界面（不要操作 DOM）。React 来决定如何最高效地更新 DOM。 大部分组件的工作应该是从?props?里取数据并渲染出来。但是，有时需要对用户输入、服务器请求或者时间变化等作出响应，这时才需要使用 State。 常用的模式是创建多个只负责渲染数据的无状态（stateless）组件，在它们的上层创建一个有状态（stateful）组件并把它的状态通过?props?传给子级。这个有状态的组件封装了所有用户的交互逻辑，而这些无状态组件则负责声明式地渲染数据。