jquery - Bootstrap 4工具提示位置问题

Question

Bootstrap 4 Tooltip 没有显示它在 reactjs 应用程序中的假设位置。

我已经尝试了一切

• 环境container: body
• 将正文样式设置为position: relative;

我的代码在 html 头中有以下层次结构

<link rel="stylesheet" href="/static/css/bootstrap-4.1.min.css" />
<script type="text/javascript" src="/static/js/jquery-3.2.1.slim.min.js" />
<script type="text/javascript" src="/static/js/popper-1.12.9.min.js" />
<script type="text/javascript" src="/static/js/bootstrap-4.1.min.js" />
<script type="text/javascript" src="/static/js/script.js" />
<link rel="stylesheet" href="/static/css/react-widgets.css" />
<link rel="stylesheet" href="/static/css/styles.css" />

用法：

<div data-toggle="tooltip" data-placement="right" data-original-title="Title Here">
    <a>Links Goes Here</a>
</div>

这是一个截图

https://i.ibb.co/kDzjL7c/CADS.png

标签： jqueryreactjsbootstrap-4tooltippopper.js

Answer 1

a像这样在标签内移动你的属性：

<div>
  <h3>Tooltip Example</h3>
  <a data-toggle="tooltip" data-placement="right" data-original-title="Title Here">Hover over me</a>
</div>