テーブルの行の中にポップオーバーが表示されない

Question

JavaScript（ReactJS）のマップの機能を使ってテーブルを構築しています。

最後の列に、（最終的に）情報を保持するポップオーバーを開くためのボタンが必要です。このセルは次のように行われています：

<td> 
    <div> 
     <button className="btn btn-primary" 
       tabIndex="0" 
       role="button" 
       data-toggle="popover" 
       data-trigger="focus" 
       title="Details" 
       data-content="Testing, Testing"> 
       <b>IN PIT</b> 
     </button> 
    </div> 
</td> 

これまでのところ、このボタンは表示されますが、ポップオーバーはありません。私はフロントエンドのデザイナーではないので、npmやその他のものは使用していません。それは設定が簡単ではないようです。私はちょうどテスト目的のために "十分に良い"ものを望んでいます。

私には何が欠けていますか？

Answer 1

https://pastebin.com/KuRHjWxrをご覧ください。人身売買はうまくいかず、他の方法で実装する必要があります。 DOMにボタンがない場合、 $('[data-toggle="popover"]').popover(); $('[data-toggle="tooltip"]').tooltip();を開始します。

ボタンがDOMに正常にレンダリングされた後に.popover()と.tooltip()と呼び出してください。

Answer 2

属性の名前は、機能を提供するためにブートストラップ（外部ライブラリ）がロードされ、要素に添付されることを期待していることを意味します。ブートストラップはページのスクリプトタグに含まれていますか？これらの属性は自分自身では何もしません。アクションをアタッチするためのタグに過ぎません。 addressタグの末尾にbootstrap cdnタグを追加します。