关于React的高阶组件

#1

这段代码看得不是很懂，AngryTitle 不是通过 yell 包装出来的么？那它里面的内容是怎么通过 props 传进去的？能麻烦解释一下整个具体的流程么QAQ

class App extends Component {
  render() {
    const yell = (PassedComponent) =>
      ({ children, ...props }) => {
        console.log(props);
        return (
          <PassedComponent {...props}>
            {children.toUpperCase()}
          </PassedComponent>
        )
      }

    const Title = (props) => <h1>{props.children}</h1>
    const AngryTitle = yell(Title)

    return (
      <div className="App">
        <AngryTitle>React</AngryTitle>
      </div>
    );
  }
}
#2

你是指React这五个字符吗？
AngryTitle实际上是这个
({ children, …props }) => {
console.log(props);
return (
<PassedComponent {…props}>
{children.toUpperCase()}

)
}，对吧
然后 { /* anything */ } 中间的东西会作为AngryTitle的children

#3

这个就是 React 做的事情啊，React 把 JSX 的内容解析成 props，也是 React 负责 props 的传递。