上的onClick調用功能的陣營

Question

在我的組件定義的反應，我追加的事件監聽像這樣：

/* events.js */ 
export function mouseyDown(event) { 
    console.log(event.target); 
} 

/* main.js */ 
import mouseyDown from '../controllers/events.js'; 
const Topbar = React.createClass ({ 
    callMouseyDown : function(event) { 
     console.log(event.target); 
     mouseyDown(); // actually need to pass event to this method too 
    }, 
    render : function() { 
     return (
      <div className="tbIcon" data-action="shareSocial" onClick={ this.callMouseyDown}>G</div> 
    )} 
}); 

然而，反應是給我一個_EventController2.default is not a function錯誤。 我在做什麼錯？

Answer 1

Mousedown不是已創建對象的屬性，而是您已導入的函數。因此，你需要省略this關鍵字：

onClick={mouseyDown} 

而且你需要你的函數導出爲默認：

export default function mouseyDown(event) { 
    console.log(event.target); 
} 
// ... 
import mouseyDown from '../controllers/events.js'; 

或使用名爲進口：

export function mouseyDown(event) { 
    console.log(event.target); 
} 
// ... 
import {mouseyDown} from '../controllers/events.js';