SPHP內置了強大的快速構建器,可以幫助開發者快速構建表單頁面、數據表格和彈窗,以便讓開發者專注于業務邏輯,而不用把過多的精力放在制作各種頁面上,今后SPHP將推出更多不同的構建器。
> 目前SBuilder僅用于后臺頁面, 暫不支持在前臺使用
## 基本使用
SPHP的所有快速構建器都統一由`SBuilder`來調用和處理,在使用前只需要引入SBuilder即可方便的使用各種構建器。
### 1.引入SBuilder
~~~
use evan\sbuilder\builder\SBuilder;
~~~
### 2.調用make和fetch方法創建并構建頁面
~~~
use evan\sbuilder\builder\SBuilder;
class Demo extends Admin
{
/**
* 示例表單頁
* @return mixed
* @throws \think\Exception
*/
public function index()
{
// return SBuilder::make('table')->fetch();
// 或使用快捷方法
return SBuilder::makeTable()->fetch();
}
}
~~~
SBuilder本身只有一個靜態方法`make()`和一個普通方法`fetch()`,其他擴展方法由各自的構建器實現。
> 如無特殊說明,后面的章節將直接使用ZBuilder,默認為已引入ZBuilder
## make(構建器名, layout)
`make`方法第一個參數,也就是要構建的類型,目前有以下幾種:
> 構建區塊類型時, 會創建一個頁面, 包含該類型的區塊, 同時可以給此頁面添加其他的區塊
| 構建器名 | 含義 |
| --- | --- |
| page | 空頁面(不包含區塊, 需自己再添加區塊) |
| block | 空區塊 |
| form | 表單構建器 |
| table | 表格構建器 |
| charts | 圖表構建器 |
| html | 自定義html內容 |
| iframe | 包含iframe外鏈的區塊 |
| data-panel | 數據面板 |
| card-list | 卡片列表 |
## 快捷方法
> 建議使用快捷方法, 這樣可以使編輯器提供友好的代碼提示
>
`makeForm` 等同于 `make('form')`
`makeTable` 等同于 `make('table')`
`makeCharts` 等同于 `make('charts')`
`makeHtml` 等同于 `make('html')`
`makeIframe` 等同于 `make('iframe')`
`makeDataPanel` 等同于 `make('data-panel')`
`makeCardList` 等同于 `make('card-list')`
## fetch([輸出變量])
`fetch`方法是渲染頁面結構并返回一個頁面結構給前端,一般不需要傳參,直接return即可。
傳參時將把傳入的數據覆蓋到頁面結構數據上并返回
- 序言
- 下載及安裝
- 目錄結構
- 基礎
- 多站點-單入口文件(推薦)
- (舊)多站點-多入口文件方式
- (舊)入口文件
- (舊)站點配置
- 按鈕操作
- 區塊概念
- 構建器(SBuilder)
- 頁面-Page
- 設置頁面標題
- 添加頁面提示信息
- 設置頁面Tab
- 設置頁面背景色
- 設置是否點擊遮罩關閉
- 添加區塊
- 區塊-Block
- 設置區塊名
- 設置區塊布局
- 表單(form)
- 添加表單項通用方法
- 添加表單項
- 單行文本框
- 多行文本框
- 數字輸入框
- 密碼框
- 數組輸入框
- 單選框
- 狀態選擇器
- 復選框
- 下拉框
- 級聯選擇器
- 開關
- 日期選擇器
- 日期時間選擇器
- 日期范圍選擇器
- 日期時間范圍選擇器
- 時間選擇器
- 時間范圍選擇器
- Tree 樹形組件
- 圖標選擇器
- 顏色選擇器
- 單圖片上傳
- 多圖片上傳
- 視頻上傳
- 單文件上傳
- 多文件上傳
- 富文本編輯器-QEditor
- 富文本編輯器-UEditor
- 小程序富文本
- 靜態文本
- 隱藏表單項
- 表格數據輸入框
- 分組
- 地圖選擇器(未實現)
- 地區選擇器(未實現)
- 穿梭框(未實現)
- 圖片裁剪(未實現)
- 郵箱輸入框(未實現)
- 設置表單LabelWidth
- 設置表單提交地址
- 設置默認按鈕標題
- 提交表單確認框
- 隱藏默認按鈕
- 添加額外按鈕
- 設置觸發器
- 設置表單數據
- 表單布局
- 模板
- 表格(table)
- 設置表名
- 添加頂部按鈕
- 添加時間段篩選
- 設置搜索欄
- 添加列
- text
- byte
- status
- tags
- yesno
- datetime
- icon
- image
- images
- external_image[已廢棄]
- external_images[已廢棄]
- link
- html
- select
- text.edit
- group
- 多選框欄
- 數量索引欄
- 操作欄
- 右側操作按鈕
- 設置多選框
- 設置顯示數量索引
- 設置列表數據地址
- 直接設置數據
- 關閉ajax獲取數據功能
- 設置分頁
- 自動新增
- 自動編輯
- 圖表(Charts)
- Html
- Iframe
- 數據面板
- 卡片列表
- 按鈕(Button)
- 按鈕調用示例
- 自定義組件
- 混合頁面
- 概念說明
- 擴展
- 圖標擴展
- 雜項
- 幫助函數
- TODO