事件
在 React 中你不能通過返回 false
(愚人碼頭注:即 return false;
語句) 來阻止默認行為文搂。必須明確調(diào)用 preventDefault
。例如穷蛹,對于純 HTML 土陪,要阻止鏈接打開一個新頁面的默認行為,可以這樣寫:
<a href="#" onclick="console.log('The link was clicked.'); return false">
Click me
</a>
在 React 中, 應該這么寫:
function ActionLink() {
function handleClick(e) {
e.preventDefault();
console.log('The link was clicked.');
}
return (
<a href="#" onClick={handleClick}>
Click me
</a>
);
}
這里肴熏, e 是一個合成的事件鬼雀。 React 根據(jù) W3C 規(guī)范 定義了這個合成事件,所以不需要擔心跨瀏覽器的兼容性問題蛙吏。
類事件綁定
在JSX回調(diào)中你必須注意 this
的指向源哩。 在 JavaScript 中,類方法默認沒有 綁定 鸦做。如果你忘記綁定 this.handleClick
并將其傳遞給onClick
励烦,那么在直接調(diào)用該函數(shù)時,this
會是 undefined
泼诱。
這不是 React 特有的行為坛掠;這是 JavaScript 中的函數(shù)如何工作的一部分。 一般情況下治筒,如果你引用一個后面沒跟 ()
的方法屉栓,例如 onClick={this.handleClick}
,那你就應該 綁定(bind) 該方法矢炼。
通常建議在構(gòu)造函數(shù)中進行綁定系瓢。