online 基礎篇-JS增強 === *所謂JS增強，即通過在線編寫JS腳本實現表單動態效果。 通過按鈕觸發事件、或綁定內置鉤子函數，或監聽表單字段改變事件來觸發JS代碼。* >[info] JS增強是在線開發概念，不支持代碼生成器生成。 ### 配置步驟 1. 選中一張online表單，點擊列表上方 `JS增強` 按鈕  2. 錄入自定義的js代碼，選擇類型 `form(表單)`/`list(列表)` 點擊確定保存  ``` buttonOne(){ console.log('列表上方按鈕點擊獲取選中行id',that.table.selectedRowKeys); } linkButtonTest(row){ console.log('操作列按鈕點擊獲取當前行數據', row) } beforeDelete(row){ console.log('刪除數據之前執行', row) } ``` ### 配置說明： - js增強方法定義：不要使用function test(){}的形式 ,一律使用funname(){}的形式 - 如果方法需要綁定`自定義按鈕`，請先創建`自定義按鈕` - js增強方法名規范：方法名唯一,需要和自定義按鈕的buttonCode保持一致，如上述代碼`buttonOne`，`linkButtonTest`,或者遵循內置方法名（如下列表 ） 列表JS增強方法名 | 描述 | ---|---| beforeAdd | 在新增之前調用,后續擴展after方法 | beforeEdit | 在編輯之前調用,該方法可以攜帶一個參數row，表示當前記錄，后續擴展after方法 | beforeDelete | 在刪除之前調用,該方法可以攜帶一個參數row，表示當前記錄,后續擴展after方法 | created | 在對應頁面vue鉤子函數created中調用 | 表單JS增強方法名 | 描述 | ---|---| | loaded | 表單數據加載完成后觸發 （支持獲取表單數據） | | beforeSubmit | 表單數據提交之前 [詳細文檔](http://doc.jeecg.com/2061290) | - js增強關鍵字：在任意方法內，可使用that關鍵字,該關鍵字指向當前頁面的vue實例,那就意味著可以用that調用任何當前頁面的實例方法/屬性,如加載數據that.loadData(),獲取查詢對象that.queryParam或是that.getQueryParams()等等。 - js增強中發起后臺請求： 和前端開發保持一致,使用`postAction`,`getAction`,`deleteAction`(參考下例) 備注： 什么情況下定義的js增強方法會攜帶參數row？js增強最終還是掛載在按鈕上或是掛在vue鉤子函數中，我們列表按鈕按按鈕樣式劃分有兩種,一種在列表上方，一種在列表操作列下，在操作列下的按鈕，其對應的方法都會攜帶一個參數row,指向當前行記錄，如上述示例linkButtonTest方法。 ### 示例（**js增強中發起后臺請求**） - 1.后臺定義請求方法  - 2.定義js增強（此處是直接在created中發起了一個請求）  - 3.進入頁面測試效果如下：  后臺也接收到參數