MDC Web 组件 - 停用文本字段的焦点不起作用

Question

我正在尝试使用 mdc Web 组件实现自动完成输入。我有一个菜单选择的事件侦听器，我想在其中停用文本字段上的焦点。我已经通过使用MDCTextFieldFoundation停用Focus方法尝试过：

const inputFoundation = new MDCTextFieldFoundation(
document.querySelector(".mdc-text-field")
);
menu.listen("MDCMenu:selected", e => {
console.log(inputFoundation);
input.value = e.detail.item.dataset.value;
inputFoundation.deactivateFocus();
});

但是，这是行不通的。在控制台中，我还可以看到当文本字段仍然聚焦时，输入的属性 isFocused 为 false。您可以在此处查看整个代码沙箱。我在这里做错了什么，从文本字段中停用焦点的正确方法是什么？

Answer 1

来自文档：

停用文本字段的焦点状态。通常在响应输入模糊事件时调用。

因此，deactivateFocus更新组件的状态，但不会更改焦点。

你需要自己打电话blur。例如像这样：

document.activeElement.blur()