裝飾進口陣營組件與高階組件

Question

我知道如何像這樣的出口前裝飾組件：

export default ButtonDecorator(MainButton) 

但如果我嘗試做一個索引導入，然後不同的裝飾它的一些情況。它不會工作。

這裏是索引的例子：高階組件

​​

和：

import React, { Component } from 'react' 

let Btn = InnerComponent => { 
    class NewBtn extends Component { 

     constructor(props) { 
      super(props) 
     } 

     render() { 
       return (
        <button onClick={this.props.onClick}> 
         <InnerComponent disabled={this.props.disabled} /> 
        </button> 
       ) 
     } 
    } 

    return NewBtn 
} 

export default Btn 

什麼是做到這一點的正確方法？

Answer 1

據我所知export需要一個名稱（變量），而不是一個函數調用。試試這個：

const ButtonDecoratedMainButton = ButtonDecorator(MainButton); 
const LinkDecoratedMainButton = LinkDecorator(MainButton); 

export { 
    DecoratedMainButton as MainButton, 
    LinkDecoratedMainButton as MainHrefButton, 
    BackButton 
}