对于任何使用react-bootstrap并遇到此问题的人，以下是我所做的工作:

.btn:focus {
    /* the !important is really the key here, it overrides everything else */
    outline: none !important;
    box-shadow: none !important;
}

在添加!之前，事情并没有工作。

直接在HTML标签中(在您可能想要在设计的其他地方留下引导主题的场景中)..

尝试的例子..

<button style="border: transparent;">

<button style="border: 1px solid black;">

. .等。这取决于你想要的效果。

对于想要一个纯css方式的人来说:

:focus:not(:focus-visible) { outline: none }

这也可以为链接等工作，和奖金，它保持键盘的可访问性。最后，它被不支持焦点可见的浏览器忽略

我在上面的评论中提到了这一点，但为了清晰起见，有必要把它作为一个单独的答案列出。只要你不需要在按钮上设置焦点，你可以在它应用任何CSS效果之前使用焦点事件删除它:

$('buttonSelector').focus(function(event) {
    event.target.blur();
});

这避免了在使用click事件时可以看到的闪烁。这确实限制了界面，并且您将无法选择按钮，但这在所有应用程序中都不是问题。

我找到了一个解决方案，只需在css代码中添加以下行。

button:focus { outline: none }

在CSS中添加这个:

*, ::after, ::before {
    box-sizing: border-box;
    outline: none !important;
    border: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}