如何自动配置popper.js箭头？

Question

在他们的官方网站上，popper.js声称它会自动为你处理箭头。https://popper.js.org/#arrows

然而，当我尝试一些基本的html内容时，箭头不显示：

<div id="popover-trigger"></div>
<div id="popover-container">
    <span class="arrow"></span>
</div>
<script type="text/javascript">
    const popper = new Popper(popper_trigger, popper_content, {
                "placement": "top",
                "modifiers": {
                    "arrow": {
                        element: '.arrow'
                    },
                   "offset": { 
                       enabled: true,
                       offset: '0,10'
                    }
                },
                "onCreate": function(data){
                    console.log(data);
                }
            });
</script>

我在网上搜索了一下，发现很少提到这个功能。其中一些涉及手动添加css style：enter link description here，而我认为这个特性应该开箱即用。

我还使用开发人员的工具检查了生成的html结构，但没有发现任何与箭头相关的元素。

我是不是漏掉了什么？

Answer 1

尝试将x箭头添加为属性：<span x-arrow></span>