完成后，如何去除隐形隐身徽章？ （不隐藏）

Question

我可能无法删除徽章。当用户打开联系人模式时，会创建一个徽章。

当前，我仅在模式关闭后才隐藏徽章。

let badge = document.querySelector('.grecaptcha-badge');

if(! badge) return;

badge.style.display = 'none';

问题是当用户决定再次打开模态时。为此，它再次创建了徽章。

这里是一个例子。在打开和关闭模态3次之后，它会创建6个div。

通常，删除“外部徽章”不会有问题，但是Google会以某种方式添加另一个div，因此更难以实现。

在Google的documentation上，我看到了grecaptcha.reset（），但是很遗憾，这只是将其删除并带回了。

我正在使用Vue，目前使用的方法来呈现Recaptcha徽章如下：

const recaptchaDiv = document.createElement('div');
recaptchaDiv.className = 'outside-badge';
document.body.appendChild(recaptchaDiv);

this.widgetId = grecaptcha.render(recaptchaDiv, {
    sitekey: this.sitekey,
    size: "invisible",
    badge: this.badge || "bottomright",
    theme: this.theme || "light",
    callback: token => {
        this.callback(token);
        grecaptcha.reset(this.widgetId);
    }
});

当模式关闭时，变量将被破坏，并且我无权访问this.widgetId。