reactjs - HOC 中的内部函数如何获取 props

Question

我只是在使用HOCin React，让我有点困惑的一件事是，在这个例子中我的内部函数如何props作为参数访问？

const withProps = Component => (
  props => {
    return <Component {...props}/>
  }
)

export default withProps

标签： reactjshigher-order-functionshigher-order-components

Answer 1

为了向@AliAnarkali 所说的添加更多内容，HOC 会返回一个组件，因此当您编写时

const EnhancedApp = withProps(App);

EnhancedApp 基本上是

  const EnhancedApp = props => {
    return <Component {...props}/>
  }

哪个功能组件以及当您呈现 EnhancedApp 时

<EnhancedApp onChange={this.onChange} value={this.state.value} />

这类似于功能组件接收 onChange 和 value 作为 props 的方式，因此在 HOC 中，内部函数会像这样获取 props。