該插件為分頁列表的操作封裝，使用方式如下：
```
//以element-ui為例
<template>
<div class="content">
<el-table :data="page.list">
<el-table-column label="姓名" prop="name"/>
<el-table-column label="年齡" prop="age"/>
...
</el-table>
<el-pagination
:total="page.total"
:page-size="page.pageSize"
:current-page.sync="page.pageNum"
@current-change="onPageNumChange"
@size-change="onPageSizeChange"/>
</div>
</template>
<script>
import JBoot from 'jboot-env'; //引入框架
import 'jboot-env/dist/loading.css'; //引入loading樣式
export default JBoot.page({
data (){
return {
moduleName: 'test'
}
}
})
</script>
<style lang="scss">
...
</style>
```
**內置屬性：**
| 名稱 | 類型 | 默認值 | 必須主動聲明| 描述|
| --- | --- | --- | --- |--- |
|queryMethod|string|queryByPage|是|查詢列表數據時，要調用moduleName對應api中的哪一個方法。|
|deleteMethod|string|delete|是|刪除列表數據時，調用moduleName對應api中的方法名稱|
|batchDeleteMethod|string|無|否|批量刪除列表數據時，調用moduleName對應api中的方法名稱|
|conditionChanged|boolean|false|否|查詢條件是否發生了變更，true為變更，false為無變更|
|createPageName|string|無|調用createPage時要顯示聲明，未聲明則依次查找erditPageName、detailPageName，如果都未聲明，則拋出異常。|新建頁面的routerName|
|editPageName|string|無|調用editPage時要顯示聲明，未聲明則依次查找createPageName、detailPageName，如果都未聲明，則拋出異常。|編輯頁面的routerName|
|detailPageName|string|無|調用detailPage時要顯示聲明，未聲明則依次查找createPageName、editPageName，如果都未聲明，則拋出異常。|詳情頁面的routerName|
|createDialogRef|string|createDialogRef|調用createDialog時要顯示聲明，未聲明則依次查找editDialogRef、detailDialogRef，如果都未聲明，則拋出異常。|新建彈框的ref標識|
|editDialogRef|string|無|調用editDialog時要顯示聲明，未聲明則依次查找createDialogRef、detailDialogRef，如果都未聲明，則拋出異常。|編輯彈框的ref標識|
|detailDialogRef|string|無|調用createDialog時要顯示聲明，未聲明則依次查找createDialofRef、editDialogRef，如果都未聲明，則拋出異常。|詳情彈框的ref標識|
|page|{pageNum,pageSize,total,data}|{pageNum:1,pageSize: 15,total:0,data:[]}|否|分頁數據對象|
|defaultQueryPageNum|string或number|1|否|分頁查詢時，默認傳輸的頁碼。|
|defaultQueryPageSize|string或number|15|否|分頁查詢時，默認傳輸的每頁條目數。|
|deleteConfirmMessage|string|是否要刪除該數據？|否|3.1.3674起新增！調用框架刪除方法時，confirm的message內容。|
|deleteConfirmTitle|string|刪除確認|否|3.1.3674起新增！調用框架刪除方法時，confirm的title內容。|
**內置方法：**(編寫順序按照執行順序排列)
| 名稱 | 參數| 返回值|描述|
| --- | --- | --- | --- |
|getQueryPageCondition()|無|返回分頁查詢的參數，頁碼與每頁條目數。|返回分頁查詢的參數，頁碼與每頁條目數。|
|onPageNumChange(pageNum)|pageNum：number類型，頁碼|無|頁碼改變時的處理函數。|
|onPageSizeChange(pageSize)|pageSize：number類型，每頁條目數|無|每頁條目數改變時的處理函數。此時會將頁碼重置為1。|
|deleteHandler(item, afterQuery, ...params)|item:要刪除的數據，該值可為單個對象或對象數組。afterQuery：刪除完畢后是否執行查詢，默認為true。params：需要傳入的其他參數|無|刪除列表數據，支持批量或單條刪除。|
|deleteBefore(item,...params)|item:要刪除的數據，該值可為單個對象或對象數組。params：數組類型，調用deleteHandler時傳入參數大于兩個時，其他的都會在params中|boolean|用來判斷是否可以執行刪除操作，返回true則繼續執行刪除操作，返回false則終止。|
|deleteAfter(item,...params)|item:要刪除的數據，該值可為單個對象或對象數組。params：數組類型，調用deleteHandler時傳入參數大于兩個時，其他的都會在params中|無|刪除完畢以后的hook。|
|getDialogRefIfDefault(ref)|ref：string類型，要獲取的ref。|string / undefined|如果不存在則依次返回createDialofRef、editDialogRef、detailDialogRef中不為空值的一個。**注意：此方法為框架內部實現，非特殊情況不要重寫此方法，以免造成未知錯誤！**|
|showCreate(params)|params:需要傳入到彈框頁面的參數|無|打開彈框頁面，類型為創建，此時彈框頁面內置屬性readonly屬性為false，可用此屬性限制頁面元素是否可被操作|
|showEdit(id, params)|id: string或number類型，要編輯的數據ID。params：傳入彈框頁面的其他參數|無|打開彈框頁面，類型為編輯，同時根據ID查詢該數據詳情。此時彈框頁面內置屬性readonly屬性為false，可用此屬性限制頁面元素是否可被操作|
|shwoDetail(id, params)|id:要查看的數據ID。params：傳入彈框頁面的其他參數|無|打開彈框頁面，類型為查看，同時根據ID查詢該數據詳情。此時彈框頁面內置屬性readonly屬性為true，可用此屬性限制頁面元素是否可被操作|
|getPageNameIfDefault(pageName)|pageName：stirng類型，獲取需要的pageName|string / undefined|如果不存在則依次返回createPageName、editPageName、detailPageName中不為空值的一個。**注意：此方法為框架內部實現，非特殊情況不要重寫此方法，以免造成未知錯誤！**|
|toCreate(params)|params：需要傳遞到跳轉后頁面的參數|無|跳轉到pageName對應的頁面，類型為新建，此時跳轉后頁面內置屬性readonly屬性為false，可用此屬性限制頁面元素是否可被操作。|
|toEdit(id, params)|id：string或number類型，要編輯的數據ID。params：傳入跳轉后頁面的其他參數|無|跳轉頁面，類型為編輯，同時根據ID查詢該數據詳情。此時跳轉后頁面內置屬性readonly屬性為false，可用此屬性限制頁面元素是否可被操作|
|toDetail(id, params)|id：string或number類型，要查看的數據ID。params：傳入跳轉后頁面的其他參數|無|跳轉頁面，類型為查看，同時根據ID查詢該數據詳情。此時跳轉后頁面內置屬性readonly屬性為true，可用此屬性限制頁面元素是否可被操作|
