Dekorieren importiert Reagieren Komponente mit höherer Ordnung Komponente

Question

Ich weiß, wie eine Komponente dekorieren, bevor es wie folgt exportieren:

export default ButtonDecorator(MainButton) 

Aber wenn ich versuche, einen Index, um es zu importieren und es anders für einige Fälle dekorieren. Es wird nicht funktionieren. Hier

ist das Beispiel des Index:

import MainButton from './main/main_button' 
import BackButton from './back/back_button' 

import { ButtonDecorator, LinkDecorator } from 'decorators' 

export { 
    ButtonDecorator(MainButton) as MainButton, 
    LinkDecorator(MainButton) as MainHrefButton, 
    BackButton 
} 

Und die höhere Ordnung Komponente:

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 

Was ist der richtige Weg, dies zu tun?

Answer 1

Soweit ich weiß export erfordert einen Namen (Variable), und nicht eine Funktion aufrufen. Versuchen Sie Folgendes:

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

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