Bootstrap 5.2工具提示：无法通过HTML数据属性传递数组

你遇到的问题不是Bootstrap的Bug，而是数据属性的解析规则导致的：Bootstrap默认会把data属性的值当作字符串处理，而你写的['top','bottom']是JS数组语法，不是标准JSON格式，所以无法被自动解析成数组类型，才会抛出类型错误。

下面给两种可行的解决方式：

方式一：通过JS初始化时配置选项 #

直接在JavaScript中初始化工具提示，显式传入数组类型的fallbackPlacements选项，这是最稳妥的方式：

// 选中目标元素
const tooltipElement = document.querySelector('span[data-bs-toggle="tooltip"]');
// 初始化工具提示并配置选项
new bootstrap.Tooltip(tooltipElement, {
  placement: 'auto',
  fallbackPlacements: ['top', 'bottom']
});

方式二：使用标准JSON格式的数组作为data属性值 #

如果一定要用纯HTML数据属性实现，需要把数组写成标准JSON格式，同时注意HTML属性的引号嵌套：

<span data-bs-toggle="tooltip" data-bs-placement="auto" 
 data-bs-fallback-placements='["top","bottom"]' title="This is the tooltip text">Hover Over Me</span>

这里要注意两点：

• JSON数组必须用双引号包裹元素，不能用单引号
• HTML属性值外层用单引号，避免和内部JSON的双引号冲突（也可以把外层双引号转义，但用单引号更直观）
  Bootstrap会自动识别标准JSON格式的字符串，并将其解析成对应的数组类型。

内容的提问来源于stack exchange，提问作者Hashim Aziz