一切要從Michael Jackson的影片開始，或是你也可以看他寫的文章。(他是react-router的創始人之一)
本來mixin的出現是為了code的reusable，這邊不特別介紹mixin的寫法，在我開始寫的時候，就已經不流行了。
不支持es6 class
沒錯，就是這點，所以我沒寫過，我也以前也只知道這點XDD。
無方向性
我是看文章翻譯的，簡言之，mixin使用了state，這樣會使被附加的component不知道state從哪裡來，尤其是一個component內用了不只一個mixin，code會變的implict。
命名衝突
如果有兩個mixin操作了相同名稱的state，這時候就會發生命名衝突，而且程式會直接掛掉，無法跑。
採用了decorator的方式，跟mixin相比支援es6 class。想了解的可以去翻我之前寫的文章。
一樣無方向性。
一樣命名衝突，但是可以跑，後面的會覆蓋前面的，react不會警告。比起mixin，這樣應該算更不好的缺點。
在render裡面做處理，跟前兩種很不一樣的點，前面兩種被視為static composition，你只會做一次composition，在你create class的時候，而render prop為dynamic composition，每一次render的時候都會。我對這些是沒辨法自己想到見解，但我覺得這是蠻有道理的。
雖然我寫render prop，但其實常見的是Function as children?不過原理是一模一樣的，請安心使用。
試寫Function as children
class A extends Component {
state = {
}
render() {
return (
<div>
{this.props.chilren(this.state)}
</div>
)
}
}
class B extends Component {
render() {
return (
<A>
{ AState => (
...
)
}
</A>
)
}
}無方向性解決，你可以很簡單的從function的params得知是哪來的。
命名衝突解決，function的params就像module or block一樣。隸屬於不同的params，永遠不會衝突。
唯一的問題(我想的)，因為變成兩個class，多了一個<div>Root，我個人很討厭react的一堆div(炸)。
打完啦，我是看影片學的，影片裡面有更多有趣的說法，像是問題就像nail，而mixin就是hammer，然後敲敲敲，react-router其實不想寫HOC，但是因為社群需要...建議聽的懂英文而有時間的可以看看影片，很精采。
我個人是覺得應該還是各有優缺點(雖然原文是render prop必勝)，HOC有recompose這個套件，render prop有react-powerplugin這個套件，目前在寫的時候目標是往render prop走，再看看會遇到什麼坑囉。