React支持了ES6 Classes，聽聽他們怎么說

React是非死book開源的構建反應式用戶界面的JavaScript庫，非死book用它構建了Instagram app以及非死book自身的一部分功能。

在React v0.13的聲明中，非死book的開發者Ben Alpert介紹了ES6 classes的新特性，這些特性可以協助開發者編寫更有彈性的組件，與此同時，他們也打算用這些新特性代替React.createClass。

Sebastian Markb?ge在React v0.13.0 Beta 1的聲明中提供了更多有關ES6的信息。

Markb?ge 說：

JavaScript原本沒有內建的類系統，包括我們在內的每一個流行的框架都構建了自己的類系統。這意味著你需要對每一個框架語法上細微差異都要了如指掌。

我們認為我們的職責并不是設計一個類系統，我們只想使用符合JavaScript標準的方式去創造類。

使用React 0.13.0意味著你不再需要使用React.createClass來創建React組件，如果你有一個轉譯器，那么你現在就可以上手ES6 classes，你可以使用我們在react-tools里提供的轉譯器，不過你需要啟用使用harmony的選項：jsx --harmony。

class HelloMessage extends React.Component {
  render() {
    return <div>Hello {this.props.name}</div>;
  }
}

React.render(<HelloMessage name="Sebastian" />, mountNode);</pre> 



    

        雖然getInitialState還不盡如人意，但其它大多數的API應該可以滿足你的期望，我們認為，只使用簡單的實例屬性是標明一個類的特定狀態的慣用手法。同樣的，getDefaultProps和getDefaultProps也只是構造器的屬性而已。
    

export class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = {count: props.initialCount};
  }
  tick() {
    this.setState({count: this.state.count + 1});
  }
  render() {
    return (
      <div onClick={this.tick.bind(this)}>
        Clicks: {this.state.count}
      </div>
    );
  }
}
Counter.propTypes = { initialCount: React.PropTypes.number };
Counter.defaultProps = { initialCount: 0 };
 



React v0.13的其它部分也有翻天覆地的變化，包括React Core、React Tools和JSX。</blockquote>


    React 
Core中的新特性有：新的頂級API、React.findDOMNode(component)和React.cloneElement(el, 
props)。值得注意的是現在用React.findDOMNode(component)代替了component.getDOMNode()，在未
來會啟用更多的模式。根據聲明的介紹，React.cloneElement被用以拷貝React的元素（elements），這與
React.addons.cloneWithProps相似，但是它保持key和ref不變，并且不會自動合并style和className。


    對于React Tools來說，在jsx命令行中新加入了--target選項，可以允許用戶指定React所使用的ECMAScript的版本。


    React 
0.13給JSX帶來了突破性的改變，以前在一個元素內使用>或者}會被識別為一個字符串，由于JSX變更了解析的方式，現在會將其視為語法錯誤。
Alpert指出：“npm中有一個名為jsx_orphaned_brackets_transformer的包，你可以用它來尋找、修復JSX代碼中
潛在的問題”。


    React 0.13現在可以下載了。


    查看英文原文：React Introduces Support for ES6 Classes 
來自：http://www.infoq.com/cn/news/2015/03/react-es6-classes

                    

                        
 本文由用戶 jopen  自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
                        
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
                        
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！
                        
 
本文地址：http://www.baiduhome.net/news/view/fd839c                        
                        
 React