javascript - 从 DOM 中删除元素时如何删除/隐藏 Bootstrap 工具提示

Question

我目前正在使用 ReactJS 开发一个项目。我的某些组件并非一直呈现，而是根据某些条件动态变化。当这些组件附有工具提示时，我注意到如果在隐藏元素时工具提示处于事件状态，则工具提示不会消失。我正在寻找一种方法来在未呈现元素时删除或至少隐藏此工具提示。

这就是我使用 jQuery 激活工具提示的方式:

$(document).ready(function() {
      $("body").tooltip({ selector: '[data-toggle=tooltip]', placement: 'bottom' })
    })

这就是我在 html(或 jsx)中使用它的方式:

<a className="icon-btn" onClick={ () => {
//on Click I remove this parent element and show something else
}}>
<i className="fa fa-lg fa-pencil-square" title="Edit" data-toggle="tooltip"></i>
</a>

请注意，我无法通过工具提示选择所有元素:

$('[data-toggle=tooltip]').tooltip()

显然是因为我在动态添加元素？至少这是我目前的研究表明的

Answer 1

$('.tooltip').tooltip('隐藏');