反應本機和redux中的hoc組件？

Question

我想在用戶請求Api調用時顯示微調Api並且我將每個組件傳遞給高階組件以檢查是否在請求，如果請求則顯示微調框，否則不

但是在這里我得到錯誤提示說不能將類作為函數調用

//-------------Hoc Component

HOC=component=>class extends React.component{

  render(){
    (return <component {...props} {...state}/>)}
  }
}

export default connect(mapStateToProps)(HOC)

//----------login component

export default HOC(connect(mapStateToProps,{actions})(Login))

沒有HOC，它可以正常工作，但HOC會出錯。 請讓我知道如何連接兩個高階組件的解決方案

Answer 1

試試這個代碼

const HOC = WrappedComponent => {
  class abc extends Component {
    render () {
      return (
        <WrappedComponent {...this.props} {...this.state} />
      );
    }
  }

  const mapStateToProps = state => ({ state });

  const mapDispatchToProps = dispatch => bindActionCreaters({..actions}, dispatch);
  return connect(mapStateToProps, mapDispatchToProps)(abc);
}

export default compose(
  HOC,
  connect(mapStateToProps)
)(Login);