破坏ev.preventDefault（）

Question

当我尝试对进行对象分解时ev.preventDefault()，我在Chrome中收到以下错误：

Uncaught TypeError: Illegal invocation

但是，当我使用时ev.preventDefault()不破坏结构，效果很好。重现此问题的代码如下所示。

const button = document.getElementById(`test-button`);

button.onclick = ({ preventDefault }) => {
  preventDefault();
};

<button id=test-button type=button>Click me to see the error</button>

知道为什么会这样吗？或者如何将对象分解与事件对象一起使用？

Answer 1

preventDefalt是必须在事件对象上调用才能知道要防止使用的默认值的方法。当您这样做时preventDefault()，这不是方法调用语法，并且在任何地方都找不到事件对象：非法调用。销毁语法只是访问值，它不会自动绑定任何函数。

 button.onclick = (e) => {
   const { preventDefault } = e; // like const preventDefault = e.preventDefault;
   preventDefault(); // does not work, unlike preventDefalt.call(e)
};