React中jsx調用js例子

需求：

界面新增一個“導入項目”按鈕，點選該按鈕可以執行項目導入功能。按鈕點選事件部分是jsx文法代碼，而項目導入部分是封裝的js文法代碼，假設此處用alert("123")代替。若點選按鈕出現alert("123")彈框，表示onClick事件執行了js文法代碼。

具體示例如下：

項目導入部分ImportProject.js檔案：

export const IMPP = {
click_alert:function(){
alert("123");
}
};      

jsx裡引入js檔案部分：

import {IMPP} from'./ImportProject.js';      

jsx裡按鈕點選事件部分：

render() {
       return (
             <button type="button" className="ant-btn btn-filter ant-btn-primary" onClick={()=>(IMPP.click_alert())}><span>導入項目</span></button>
        ); 
  }      

效果圖：

點選“導入項目”按鈕，即可觸發ImportProject.js中的函數：