は/ Reduxのバーガーメニューが私はReduxの-バーガーメニューのドキュメントに、このラインで混乱しています

Question

を開くことができない反応：

https://negomi.github.io/redux-burger-menu/

あなたのメニューコンポーネントを飾る：

// Menu.js

import {slide as Menu} from 'react-burger-menu'; 
    import {decorator as reduxBurgerMenu} from 'redux-burger-menu'; 

    export default reduxBurgerMenu(Menu); 

上記のファイルからエクスポートしたコンポーネントは、react-burger-menuと同様に使用できます。

このコンポーネントをインポートして、反応バーガーメニューのように使用するにはどうすればよいですか？

私はここNarrativeMenuを持っている：

私はReduxのバーガーメニューでそれを使用することができますどのように

class NarrativeMenu extends React.Component { 
showSettings(event) { 
    event.preventDefault(); 
} 

render() { 
    return (
      <Menu> 
      <a id="home" className="menu-item" href="/">Home</a> 
      <a id="about" className="menu-item" href="/about">About</a> 
      <a id="contact" className="menu-item" href="/contact">Contact</a> 
      <a onClick={ this.showSettings } className="menu-item--small" href="">Settings</a> 
      </Menu> 
    ); 
} 
} 

？

Answer 1

また、少し混乱しています。

Menu.js：

import {slide as Menu} from 'react-burger-menu'; 
import {decorator as reduxBurgerMenu} from 'redux-burger-menu'; 

const ReduxBurgerMenu = reduxBurgerMenu(Menu); 

export default ReduxBurgerMenu; 

ExampleMenu.js：このような

import React from 'react'; 
import ReduxBurgerMenu from './Menu'; 

class ExampleMenu extends React.Component { 
    render() { 
     return (
      <ReduxBurgerMenu isOpen={ this.props.isOpen }> 
       <a id="home" className="menu-item" href="/">Home</a> 
       <a id="about" className="menu-item" href="/about">About</a> 
       <a id="contact" className="menu-item" href="/contact">Contact</a> 
      </ReduxBurgerMenu> 
     ); 
    } 
} 

export default ExampleMenu; 

し、それを使用します。

import ExampleMenu from 'ExampleMenu' 

... 

    render() { 
     return (
      <div id="outer-container"> 
       <Header /> 
       <ExampleMenu pageWrapId={"page-wrap"} outerContainerId={"outer-container"} /> 
       <div id="page-wrap"> 

       ... 

       </div> 
      </div> 
     ) 
    } 

...