React中jsx調用js例子

需求:函數

界面新增一個「導入項目」按鈕,點擊該按鈕能夠執行項目導入功能。按鈕點擊事件部分是jsx語法代碼,而項目導入部分是封裝的js語法代碼,假設此處用alert("123")代替。若點擊按鈕出現alert("123")彈框,表示onClick事件執行了js語法代碼。spa

具體示例以下:code

項目導入部分ImportProject.js文件:blog

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

jsx裏引入js文件部分:事件

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

jsx裏按鈕點擊事件部分:jsx

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

效果圖:io

點擊「導入項目」按鈕,便可觸發ImportProject.js中的函數:function

相關文章
相關標籤/搜索