首先恭喜React可以“回歸”開源世界焕妙，F(xiàn)acebook協(xié)議中夾帶私貨的做法實(shí)在是讓人摸不著頭腦。
隨著FB宣布React將要更改協(xié)議（https://code.facebook.com/posts/300798627056246/relicensing-react-jest-flow-and-immutable-js/）焚鹊，那么就意味著之前我們的擔(dān)心就不在了，另外爷抓，在新版本的React中加入了更強(qiáng)大的特性阻塑，讓我們一起期待React 16吧！
造輪子學(xué)React
react作為一套工具陈莽，易用程度很高，我們可以用它做出很多牛逼的玩意独柑。那么今天我就造了一個輪子私植。
「拖拽組件」作為每一個平臺都有的組件，已經(jīng)擁有各種各樣的實(shí)現(xiàn)曲稼，今天我為大家?guī)淼木褪莚eact版本的拖拽湖员。
項目預(yù)覽地址：GitHub & BitBucket HTML Preview（看不到的話多刷新幾次瑞驱，暫時不支持手機(jī)，后續(xù)版本加入）
項目倉庫：215566435/React-dragger-R（如果喜歡凳寺，請不要吝嗇手上的星星）
通過造這個輪子我們學(xué)到什么
react 的基本使用
如何監(jiān)聽用戶的鼠標(biāo)行為（addEventListener）
css盒子模型
對于css盒子模型的理解彤侍，在做這個項目中會得到淋漓盡致的體現(xiàn)，為什么呢怜瞒？
當(dāng)我們在設(shè)計「元素不能離開某個區(qū)域的api時」般哼，對于css盒子模型必須要非常清楚惠窄。
一個元素的最外層是：margin
其次到：border
內(nèi)填充：padding
寬度和高度：width & height
相信，通過這個輪子楞卡，大家一定會對css盒子模型有一個比較深入的理解脾歇，以及應(yīng)用。
項目中使用藕各？
當(dāng)然可以，我已經(jīng)把這玩意發(fā)到了npm上
npm install --save react-dragger-r
就可以安裝了作彤，使用也非常簡單乌逐，直接使用<Dragger>包裹住現(xiàn)有元素即可
import React from 'react'
import Dragger from 'react-dragger-r'
import ReactDOM from 'react-dom'
class LayoutDemo extends React.Component {
render() {
return (
<div>
<Dragger style={{ left: 50 }}>
<div>普通的拖拽組件</div>
</Dragger>
</div>
) }}
ReactDOM.render(
<div> <LayoutDemo /> </div>,
document.getElementById('root')
);
更多的文檔？
所有對外屬性（props）都在上面了
另外绢慢，所有注釋都是中文的洛波，歡迎查看源碼學(xué)習(xí)骚露，希望對你的學(xué)習(xí)有幫助
更多輪子思瘟？
一個酷炫的react簡歷模版：預(yù)覽地址
