Semantic UI React Popup（s）が表示されない

Question

タイトルを参照してください。

コードは、文字通り

<Popup 
trigger={<li id="close"><a>Close</a></li>} 
content="Click to close" 
basic 
/> 

されており、問題の項目が推移し、またはクリックされたときに、ええ、ポップアップが表示されません。 open = {true}を設定すると、（期待通りに）コンポーネントには接続されません。誰もこの問題に遭遇しましたか？可能な解決策をアドバイスできますか？

Answer 1

CSSコードは、それが位置だ作っていました：相対ましたポップアップが表示された場所に影響を与えます。間違った位置に表示されていました。残念ながら、このコードを削除すると、私たちの粘着フッタが完全になくなります。

うまくいけば、同じ問題を経験した他の誰もがこれを見て、間違いを認識することを望むでしょう。

Answer 2

あなたのコードを書き直しただけです！ただし、open属性でポップアップを制御したい場合は、そのための状態を作成し、onMouseOver関数でポップアップを開くようにしてください。

例： isPopupOpenという名前のステートを定義し、デフォルトでfalseに設定します。

handleMouseOver =() => this.setState({ isPopupOpen: true }) 

handleMouseOut =() => this.setState({ isPopupOpen: false }) 

、最終的には、ポップアップをこのように書きます：

this.state={ 
isPopupOpen : false 
} 

あなたは二つの方法で状況を処理するHTMLに適用

   <Popup 
       trigger={ 
        <li 
        id='close' 
        onMouseOver={this.handleMouseOver} 
        onMouseOut={this.handleMouseOut} 
        > 
         <a>Close</a> 
        </li> 
       } 
       content={'click to close'} 
       basic 
       open={this.state.isPopupOpen} 
      />